Hacker News new | ask | show | jobs
by chearon 1837 days ago
I often have to set `min-width: 0` if it's a flexbox inside another flexbox. `min-width` defaults to `auto` which means the smaller of the `width` on it and its content width. The content width of a flexbox (being checked here as a flex item) is not defined as the smallest width it could be without overflowing, though. It's based on the content widths of _its_ flex items, regardless of whether or not you put `min-width: 0` on those [1]. So even if that inner flexbox can shrink below the items content width, its default minimum size will be larger than that. It feels wrong when you have to do it, but it also preserves the meaning of minimum _content_, and it might be what you want in other situations.

Width/height: auto require a layout to know the size, so I don't know if we'll ever get that either.

[1] https://www.w3.org/TR/css-flexbox-1/#intrinsic-main-sizes

1 comments

That was a very good explanation, thank you.

> Width/height: auto require a layout to know the size, so I don't know if we'll ever get that either

Surely the browser ultimately knows what the size is going to be?

It does but only after a layout. Interpolating from `height: 0;` to `height: 10px` is easy, but interpolating to `height: auto` takes an additional layout. I always assumed that you can't do this either for performance reasons or because it would be really hard to implement.