- From: Ian Hickson <py8ieh@bath.ac.uk>
- Date: Sun, 16 Jan 2000 23:47:14 +0000 (GMT)
- To: Erik van der Poel <erik@netscape.com>
- cc: www-style <www-style@w3.org>
On Sat, 15 Jan 2000, Erik van der Poel wrote:
> [...]
"me too" for everything you said, except:
> 5. underline. Fonts usually have a recommended underline position
> and thickness. However, if we draw the underlines for the various
> font boxes at various positions and thicknesses, it won't look so
> good. [...]
It would also be wrong. Underlines should be drawn *for the outer
element only*. i.e., the one with "text-decoration:underline". The
underline just happens to span the children -- it should not be drawn
*by* the children.
This is why...
# [... the] color of decorations should remain the same even if
# descendant elements have different 'color' values.
See
http://www.bath.ac.uk/%7Epy8ieh/internet/eviltests/underline.html
...for some relevant test cases.
I have included below, for those who care, some edited extracts from
Mozilla bug 1777 where this has been explained a few times.
Given the following CSS+HTML snippet:
<span style="text-decoration:underline">
Outer
<span style="font-weight:bold;"> Inner </span>
Outer
</span>
The underlining should be the same throughout, as it is the
underlining of the outer span that is being applied to the inner span,
and not the inner span that is underlining itself. That is, the inner
span should have *no* effect on the rendering of the underlines. The
line should be continuous, and not thicker in the middle.
One way of looking at this is through inline boxes.
The above generates two inline boxes, one for the outer span and one
for the inner span. The inner inline box may overlap the outer inline
box (in this case they are perfectly aligned):
+-------+========+-------+
| Hello | Lovely | World |
+-------+========+-------+
The underlining should (as I understand it) be applied *to the outer
inline box* only. That is why, for example, the colour is the same
throughout an underlining.
Another way of testing this: if you made the inner span invisible
(using the visibility property), the underlining should remain.
Yet another example -- in the case of the following fragment:
<span style="text-decoration:overline" id="a">
Outer
<span style="font-weight:bold;" id="b"> Inner </span>
Outer
</span>
...the element 'a' should render the overline:
___________________
Outer Outer
...and the element 'b' should merely render its text:
Inner
...which will result in:
___________________
Outer Inner Outer
Thus the overline above 'Inner' is not any bolder than the rest.
Similarly for this fragment:
<span style="text-decoration:overline" id="a">
Outer
<span style="vertical-align: 1em;" id="b"> Inner </span>
Outer
</span>
...the element 'a' should render the overline:
___________________
Outer Outer
...and the element 'b' should merely render its text:
Inner
...which will result in:
___________________
Outer Outer
Inner
Thus the overline is not broken where the child has moved.
--
Ian Hickson ("`-''-/").___..--''"`-._
http://www.bath.ac.uk/%7Epy8ieh/ `6_ 6 ) `-. ( ).`-.__.`)
(_Y_.)' ._ ) `._ `. ``-..-' fL
Member, Mozilla Quality Assurance _..`--'_..-_/ /--'_.' ,'
Browser Standards Compliance Team (il).-'' (li).' ((!.-'
Received on Sunday, 16 January 2000 18:47:22 UTC