inline-block baseline when the baseline would be outside of the element

Hi,

consider this chrome bug / testcase:
https://code.google.com/p/chromium/issues/detail?id=258650

http://plexode.com/eval3/#s=aekVQXANJVQMbAwGVAR14Hz1Pm5aWBFBWVUZTAVydnpaJDoobGhdRWRyoqQGrR0JOSk1aGyJTSkJNs5xPtZWLGwRGzMS1Xpu0n1hTQlGnxsd5G0pPTd1GDkNNUERMzseDGxIRscTSnskEFxMlFxga6J7QxZ4dCCZaLZSodOQBJRFDw9AahUZThaagaWHLwS8GhEKAbUa0QHT/OURfwQkCbAZeAAA=

Basically, we have an inline-block div with a low height (10px), with
a big font (96px) that therefore overflows the div at the bottom.

The baseline for this div would normally be essentially the bottom of
the Y.  However, that would place the baseline for the element outside
of the element's box!

Consequently, Chrome/Webkit clamp the baseline to be the bottom of the
margin box, whereas Firefox/IE keep the baseline outside of the box
and place the X and Y at the same position.

What is the right behavior? Should baselines be allowed to be outside
the margin box of an element? A strict reading of CSS 2.1 seems to
support that, but I'd like to hear opinions of others.

Thanks!

PS: I just realized that in Firefox, if I add overflow: hidden;, then
the baseline changes! In other words: the overflow setting affects the
positioning of the box. That also seems weird?

-christian

Received on Wednesday, 10 July 2013 15:20:32 UTC