Re: [media-queries] chicken-egg problem with font-based lengths

Le 20/08/2012 14:33, Giuseppe Bilotta a écrit :
> Neither floats nor inline-blocks suffice to achieve what I want. I do
> use inline-blocks, the #container wraps a number of divs which have
> display: inline-block; however, if the #content is not sized_exactly_
> as the number of blocks (+ margins) that would fit inside the
> viewport, I get extra whitespace inside the #container, which I don't
> want. This is why I have to manually specify the #content (max-)width
> depending on the viewport width and based on the (fixed) width of its
> inline-blocks.
>
> It does seem that the fit-content would be what I need. I guess I
> should write an extra rule (after all the media queries), with
> #content { max-width: fit-content }, and wait for it to be supported.
> Thanks for the pointer.

fit-content only gives a name to the sizing algorithm shared by floats 
and inline-block:

     min(max-content, max(min-content, fill-available))

In particular, if min-content < fill-available < max-content, the 
container will use all of the available width.

I think that what you want is this: Once the layout of the content is 
done, shrink the container to the actual line break of the content. I 
don’t think this is possible to do properly as it would introduce 
circular dependencies with eg. percentages widths in the content.

fit-content on the other hand works because it is only based on 
information "intrinsic" to elements, that we can get before the layout 
is done.

-- 
Simon Sapin

Received on Monday, 20 August 2012 12:48:45 UTC