W3C home > Mailing lists > Public > www-style@w3.org > May 2012

RE: [CSS21] shortening inline-height has no apparent effect

From: Roger Baker <tstartme@hotmail.com>
Date: Mon, 14 May 2012 11:28:58 -0400
Message-ID: <SNT127-W36E67573B25EA3CE0DB5B3D31A0@phx.gbl>
To: <jackalmage@gmail.com>
CC: <www-style@w3.org>

What you're saying makes sense. When I add line-height: 0.2; to the *paragraph*, the line box shortened as expected. Boris pointed me to the section in the spec talking about the "strut," which I *believe* is referring to the same concept you're talking about (line-height of the containing block). I'm finding the strut difficult to understand -- it appears to be a zero-width ("empty") em box, with font-size and line-height as set on the block-level container, that is automatically added to each child inline box. So it was the roughly 19px strut that was keeping the span box expanded beyond my expectation.

I *think* I understand...

Thanks also for the CSS3 reference

> From: jackalmage@gmail.com
> Date: Mon, 14 May 2012 16:56:59 +0200
> Subject: Re: [CSS21] shortening inline-height has no apparent effect
> To: tstartme@hotmail.com
> CC: www-style@w3.org
> On Mon, May 14, 2012 at 4:29 PM, Roger Baker <tstartme@hotmail.com> wrote:
> > Hi,
> > Expanding the inline height of the inline box in the following example has
> > the expected separation (effect due to expansion of its line box):
> >
> > http://jsfiddle.net/8XJhY/6/
> >
> > But *shortening* the inline height of the inline box does not bring the
> > succeeding line box closer (does not appear to shorten its line box), for
> > example:
> >
> > http://jsfiddle.net/8XJhY/1/
> >
> > Can someone help me explain this (or point me to the relevant section of the
> > spec)?
> (Someone else can correct me if I'm wrong here - inline layout isn't
> my specialty.)
> I believe that line boxes size themselves to the minimum of the
> line-height of their containing block and the height of their
> contents.  So, adding a <span> with a large line-height (or just a
> large font-size, or a tall image) will grow the line box, but adding
> one with an extra-small height does nothing.
> The line-box-contain property
> <http://dev.w3.org/csswg/css3-linebox/#LineStacking> hasn't made it
> into any implementation (in general, the Line Box spec should be
> considered experimental right now), but its initial value explains
> what goes into the calculation by default - the line-height of the
> "root inline box" (created by the containing block), the line-height
> of the inlines, and the height of any replaced elements.
> ~TJ

Received on Monday, 14 May 2012 15:29:33 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:16 UTC