Firefox jams underlines for links

22/03/2008, 21h38

In CSS1Compat mode Firefox doesn't display underlines for my links if
they set to display:-moz-inline-box.

The same styling works fine in BackCompat (quirk) mode, so I guess it
is some W3C box model issue again, but how to fix it? Strangely enough
-moz-box-sizing: border-box; doesn't here, only explicit drop
into quirk mode by say removing doctype.

An URL with the very same page broken by Yahoo! insertions so being
dropped into quirk mode: underlines are just fine:
http://www.geocities.com/schools_ring/tmp/inbox.html

The page of question (no URL, sorry, cannot disclose the customer):
the underlines are hot visible on Firefox. IE, Safari and Opera are
fine in either case:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en-US">
<head>
<meta http-equiv="Content-type"
content="text/html; charset=iso-8859-1">
<title>Demo</title>
<style type="text/css">
ul#menu {
list-style-position: outside;
list-style-type: none;
font-family: Verdana, Geneva, sans-serif;
font-variant: small-caps;
font-weight: bold;
font-size: 0.7em;
}
ul#menu li {
width: 200px;
margin-bottom: 15px;
}
ul#menu li a {
display: inline-block;
display:-moz-inline-box;
width: 100%;
color: black;
}
ul#menu li a:hover {
color: red;
}
</style>
</head>
<body>
<ul id="menu">
<li><a href="http://www.example.com">Link 1</a></li>
<li><a href="http://www.example.net">Link 2</a></li>
<li><a href="http://www.example.org">Link 3</a></li>
</ul>
</body>
</html>

23/03/2008, 18h38

VK wrote:
> In CSS1Compat mode Firefox doesn't display underlines for my links if
> they set to display:-moz-inline-box.
>
> The same styling works fine in BackCompat (quirk) mode, so I guess it
> is some W3C box model issue again, but how to fix it? Strangely enough
> -moz-box-sizing: border-box; doesn't here, only explicit drop
> into quirk mode by say removing doctype.

OK, I sorted it out. If anyone interested:
Somehow -moz-inline-box kills lining for links completely in
CSS1Compat mode. I was trying different padding/margin/line-height as
I though that the underline/overline was just not having box space to
show up: until I tried line-through and it didn't work neither. So it
is not a CSS problem but some internal engine problem. Rather nasty,
really.

The workaround I found is to use
display: list-item
instead that seems to work. It doesn't fit exactly to my purposes but
better something than nothing. Does anyone know if a bugzilla bug
filed on it?

23/03/2008, 19h20

On 2008-03-22, VK <schools_ring@yahoo.com> wrote:
> In CSS1Compat mode Firefox doesn't display underlines for my links if
> they set to display:-moz-inline-box.
>
> The same styling works fine in BackCompat (quirk) mode, so I guess it
> is some W3C box model issue again, but how to fix it? Strangely enough
> -moz-box-sizing: border-box; doesn't here, only explicit drop
> into quirk mode by say removing doctype.
>
> An URL with the very same page broken by Yahoo! insertions so being
> dropped into quirk mode: underlines are just fine:
> http://www.geocities.com/schools_ring/tmp/inbox.html
>
> The page of question (no URL, sorry, cannot disclose the customer):
> the underlines are hot visible on Firefox. IE, Safari and Opera are
> fine in either case:

The spec is possibly ambiguous on this (assuming we treat
-moz-inline-box as being supposed to be the same as inline-block).

CSS 2.1 16.3.1 text-decoration:

When specified on an inline element, it affects all the boxes
generated by that element; for all other elements, the decorations
are propagated to an anonymous inline box that wraps all the in-flow
inline children of the element, and to any block-level [p. 117]
in-flow descendants. It is not, however, further propagated to
floating and absolutely positioned descendants, nor to the contents
of 'inline-table' and 'inline-block' descendants.

You could take that as meaning that setting text-decoration on any
inline-block is not propagated at all, making Firefox right.

But I think it means text-decoration goes into the first inline-block,
but not into more deeply nested inline-blocks.

Here is an example:

<style type="text/css">
.ib
{
display: inline-block;
border: 1px solid red;
height: 200px;
}
</style>
</head>
<body>
<div class="ib" style="text-decoration: underline">
Inside one ib
<div class="ib">Inside another one</div>
</div>
</body>

I think the words "Inside one ib" should be underlined, but there should
not be another underline under the words "Inside another one".

23/03/2008, 19h54

On Mar 23, 9:20 pm, Ben C <spams...@spam.eggs> wrote:
> CSS 2.1 16.3.1 text-decoration:
>
> When specified on an inline element, it affects all the boxes
> generated by that element; for all other elements, the decorations
> are propagated to an anonymous inline box that wraps all the in-flow
> inline children of the element, and to any block-level [p. 117]
> in-flow descendants. It is not, however, further propagated to
> floating and absolutely positioned descendants, nor to the contents
> of 'inline-table' and 'inline-block' descendants.
>
> You could take that as meaning that setting text-decoration on any
> inline-block is not propagated at all, making Firefox right.

That would be an extremely stretched out reading IMO: it clearly reads
to me as a compound series of dependent clauses:

[It is not, however, further propagated to]
1) {floating and absolutely positioned descendants}
<, nor >
2) {to the contents of 'inline-table' and
'inline-block' descendants}

Sure if W3C would ever learn to use ordered and unordered lists in
their passages - this is what they are continuously calling others for
on their Validator btw - then we would not need these linguistical
studies. In any case there is not a "specified" text-decoration
property in here: the default implicit text-decoration:underline
property gets removed from A elements as soon as display:-moz-inline-
box applied which is plain silly and wrong. On fine CSS issues Opera
9.x is usually good as a burden of proof and it doesn't do anything
like that.

22/03/2008, 21h38	#1 (permalink)
VK Messages: n/a Hébergeur:	Firefox jams underlines for links In CSS1Compat mode Firefox doesn't display underlines for my links if they set to display:-moz-inline-box. The same styling works fine in BackCompat (quirk) mode, so I guess it is some W3C box model issue again, but how to fix it? Strangely enough -moz-box-sizing: border-box; doesn't here, only explicit drop into quirk mode by say removing doctype. An URL with the very same page broken by Yahoo! insertions so being dropped into quirk mode: underlines are just fine: http://www.geocities.com/schools_ring/tmp/inbox.html The page of question (no URL, sorry, cannot disclose the customer): the underlines are hot visible on Firefox. IE, Safari and Opera are fine in either case: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="en-US"> <head> <meta http-equiv="Content-type" content="text/html; charset=iso-8859-1"> <title>Demo</title> <style type="text/css"> ul#menu { list-style-position: outside; list-style-type: none; font-family: Verdana, Geneva, sans-serif; font-variant: small-caps; font-weight: bold; font-size: 0.7em; } ul#menu li { width: 200px; margin-bottom: 15px; } ul#menu li a { display: inline-block; display:-moz-inline-box; width: 100%; color: black; } ul#menu li a:hover { color: red; } </style> </head> <body> <ul id="menu"> <li><a href="http://www.example.com">Link 1</a></li> <li><a href="http://www.example.net">Link 2</a></li> <li><a href="http://www.example.org">Link 3</a></li> </ul> </body> </html>

23/03/2008, 18h38	#2 (permalink)
VK Messages: n/a Hébergeur:	Re: Firefox jams underlines for links VK wrote: > In CSS1Compat mode Firefox doesn't display underlines for my links if > they set to display:-moz-inline-box. > > The same styling works fine in BackCompat (quirk) mode, so I guess it > is some W3C box model issue again, but how to fix it? Strangely enough > -moz-box-sizing: border-box; doesn't here, only explicit drop > into quirk mode by say removing doctype. OK, I sorted it out. If anyone interested: Somehow -moz-inline-box kills lining for links completely in CSS1Compat mode. I was trying different padding/margin/line-height as I though that the underline/overline was just not having box space to show up: until I tried line-through and it didn't work neither. So it is not a CSS problem but some internal engine problem. Rather nasty, really. The workaround I found is to use display: list-item instead that seems to work. It doesn't fit exactly to my purposes but better something than nothing. Does anyone know if a bugzilla bug filed on it?

23/03/2008, 19h20	#3 (permalink)
Ben C Messages: n/a Hébergeur:	Re: Firefox jams underlines for links On 2008-03-22, VK <schools_ring@yahoo.com> wrote: > In CSS1Compat mode Firefox doesn't display underlines for my links if > they set to display:-moz-inline-box. > > The same styling works fine in BackCompat (quirk) mode, so I guess it > is some W3C box model issue again, but how to fix it? Strangely enough > -moz-box-sizing: border-box; doesn't here, only explicit drop > into quirk mode by say removing doctype. > > An URL with the very same page broken by Yahoo! insertions so being > dropped into quirk mode: underlines are just fine: > http://www.geocities.com/schools_ring/tmp/inbox.html > > The page of question (no URL, sorry, cannot disclose the customer): > the underlines are hot visible on Firefox. IE, Safari and Opera are > fine in either case: The spec is possibly ambiguous on this (assuming we treat -moz-inline-box as being supposed to be the same as inline-block). CSS 2.1 16.3.1 text-decoration: When specified on an inline element, it affects all the boxes generated by that element; for all other elements, the decorations are propagated to an anonymous inline box that wraps all the in-flow inline children of the element, and to any block-level [p. 117] in-flow descendants. It is not, however, further propagated to floating and absolutely positioned descendants, nor to the contents of 'inline-table' and 'inline-block' descendants. You could take that as meaning that setting text-decoration on any inline-block is not propagated at all, making Firefox right. But I think it means text-decoration goes into the first inline-block, but not into more deeply nested inline-blocks. Here is an example: <style type="text/css"> .ib { display: inline-block; border: 1px solid red; height: 200px; } </style> </head> <body> <div class="ib" style="text-decoration: underline"> Inside one ib <div class="ib">Inside another one</div> </div> </body> I think the words "Inside one ib" should be underlined, but there should not be another underline under the words "Inside another one".

23/03/2008, 19h54	#4 (permalink)
VK Messages: n/a Hébergeur:	Re: Firefox jams underlines for links On Mar 23, 9:20 pm, Ben C <spams...@spam.eggs> wrote: > CSS 2.1 16.3.1 text-decoration: > > When specified on an inline element, it affects all the boxes > generated by that element; for all other elements, the decorations > are propagated to an anonymous inline box that wraps all the in-flow > inline children of the element, and to any block-level [p. 117] > in-flow descendants. It is not, however, further propagated to > floating and absolutely positioned descendants, nor to the contents > of 'inline-table' and 'inline-block' descendants. > > You could take that as meaning that setting text-decoration on any > inline-block is not propagated at all, making Firefox right. That would be an extremely stretched out reading IMO: it clearly reads to me as a compound series of dependent clauses: [It is not, however, further propagated to] 1) {floating and absolutely positioned descendants} <, nor > 2) {to the contents of 'inline-table' and 'inline-block' descendants} Sure if W3C would ever learn to use ordered and unordered lists in their passages - this is what they are continuously calling others for on their Validator btw - then we would not need these linguistical studies. In any case there is not a "specified" text-decoration property in here: the default implicit text-decoration:underline property gets removed from A elements as soon as display:-moz-inline- box applied which is plain silly and wrong. On fine CSS issues Opera 9.x is usually good as a burden of proof and it doesn't do anything like that.

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email