| Darin McGrew 2003-12-18, 8:46 pm |
| Eric Meyer's <http://www.meyerweb.com/eric/css/inline-format.html> is very
clear that it is not a simple introduction to the inline formatting model.
Unfortunately, that's what I think I need.
I understand the desired behavior: parent inline elements should not
stretch in height to fit nested child inline elements that are taller than
the parent.
What I'm missing is the "why", the rational behind this behavior that will
help me make sense of it.
Can anyone offer a simple introduction to the inline formatting model that
explains the underlying principles? I'm hoping to move beyond "because
that's what the experts say should happen" and begin to understand why this
behavior would make sense.
TIA
For those of you unfamiliar with the examples in Eric Meyer's article, the
behavior is demonstrated by the excerpt:
<p><span style="border: 1px solid gray;">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua.
<span style="font-size: 3em; border: 1px solid red">3em</span>
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
ut aliquip ex ea commodo consequat.
</span></p>
The outer (gray border) SPAN should remain 1em high, even while the 3em
text of the inner (red border) SPAN pushes some of the lines of the
paragraph apart. MSIE incorrectly allows the inner SPAN to stretch the
height of the outer SPAN.
--
Darin McGrew, darin@TheRallyeClub.org, http://www.TheRallyeClub.org/
A gimmick car rallye is not a race, but a fun puzzle testing your
ability to follow instructions. Upcoming gimmick car rallye in
Silicon Valley: Winter Solstice (Saturday, January 3)
|