Re: [css4-text? css4-box?] Absolutely positioned child elt, ignore width of parent elt for linebreaking

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