- From: Zack Weinberg <zackw@panix.com>
- Date: Wed, 1 May 2013 13:35:31 -0400
- To: "Tab Atkins Jr." <jackalmage@gmail.com>
- Cc: www-style list <www-style@w3.org>
- Message-ID: <CAKCAbMjn3fhUTG058KhnjugaQ5-whhzPLZwK=ybT2yn86uvjaQ@mail.gmail.com>
The Sizing keywords look like exactly what I want in this case. I'll have to find a workaround anyway, since those are not ready for general use, but still, thanks for the tip. (The parent block is the desired abspos container. Technically I don't need to *position* the inner block at all, but I do need it to not affect the layout of the parent, which position:absolute is the least troublesome way to accomplish.) On Wed, May 1, 2013 at 11:37 AM, Tab Atkins Jr. <jackalmage@gmail.com>wrote: > On Wed, May 1, 2013 at 8:25 AM, Zack Weinberg <zackw@panix.com> wrote: > > In the attached test case, the three outlined boxes are laid out at their > > narrowest possible width without breaking words, because despite being > > position:absolute (which takes them out of flow) and width:auto, they are > > *structurally* inside containers with fixed, narrow widths. If you > comment > > out width:30px in the first style declaration, they are instead laid out > at > > their widest possible width given the max-width setting and the measure > of > > the text. > > > > As far as I can tell, there is no way to get the "widest possible" > behavior > > with this HTML structure and a fixed-width parent element. It would be > nice > > if there were such a way; this structure may be necessary for other > reasons > > (I tripped over this while trying to put <details> elements in a table). > > This happens, obviously, because the parent is still providing the > containing block for the absposes. If you comment out the > position:relative, they'll also lay out widely, as they switch to > using the ICB as their containing block. > > You want either: > > 1. Explicit control over the containing block, or > 2. The sizing keywords, so you can say "width: max-content;" on the > absposes (and then use max-width to prevent them from going crazy, as > you've done in your example). > > The latter is already present in the Sizing draft, and Moz implements > the values prefixed (Chrome is also implementing them). The former > doesn't exist yet, but I've got some early ideas for it on my blog, > and plan to explore it in the future in the Positioning module > > ~TJ >
Received on Wednesday, 1 May 2013 17:35:53 UTC