CSS CSS Flexbox Layout Flexbox Properties Smarter Layouts with flex-basis and flex

Vasilis Moutzouridis
Vasilis Moutzouridis
4,364 Points

flex-basis: 0; | items break to new lines.

it seems that items cannot shrink to 0 pixels and they break to new lines with a flex-basis set to 0;

.container { display: flex; flex-wrap: wrap; }

.item{ flex-grow: 1; flex-basis: 0; }

whats wrong ?

1 Answer

Dmitry Polyakov
Dmitry Polyakov
4,410 Points

Container is set up as flex-wrap: wrap. This attribute makes all items inside the container to wrap onto a new line.

Try flex-wrap: no-wrap