text decoration inheritance

[Andrew Tang]

Hi, I need some help with understanding this piece of css.

<u>This is a <a href="#" style="text-decoration:none ;">hyperlink </a> with
surrounding underlining</u>

From what I understand of css, the styling in <a> should override its
parent. But it doesnt seem to work in this case, the whole sentence is still
underlined even though I have specifically specified no text-decoration. I'm
not saying its wrong but I really cant get my head around to why this is -
is this a case exception?

Btw, this only happens with Gekko (Mozilla) and Opera which follows the W3c
recommednation properly. IE6 seems to render it as I would have expected
(with hyperlinks anyway).

Much appreciated,
Andy

[Philipp Lenssen]

Andrew Tang wrote:

<u>This is a <a href="#" style="text-decoration:none ;">hyperlink </a>
with surrounding underlining</u>

Do not use inline-styles!
Instead, use:
a:link, a:visited etc. { text-decoration... }

When you turn off text-decoration, make sure to find a good replacement
(like setting the link-color... and setting the back-color).

Does that solve your problems?
--
Google Blogoscoped
http://blog.outer-court.com

[Johannes Koch]

Philipp Lenssen wrote:

Andrew Tang wrote:

<u>This is a <a href="#" style="text-decoration:none ;">hyperlink </a>
with surrounding underlining</u>

When you turn off text-decoration, make sure to find a good replacement
(like setting the link-color... and setting the back-color).

Additionally, don't underline text, which is no link.
--
Johannes Koch
In te domine speravi; non confundar in aeternum.
(Te Deum, 4th cent.)

[Philipp Lenssen]

Johannes Koch wrote:

Philipp Lenssen wrote:

Andrew Tang wrote:

>><u>This is a <a href="#"
style="text-decoration:none ;">hyperlink </a>
with surrounding underlining</u>

When you turn off text-decoration, make sure to find a good
replacement (like setting the link-color... and setting the
back-color).

Additionally, don't underline text, which is no link.

Absolutely. The only need for that would be as a reminder in
development stage that this should be a link. Everything that goes live
on the Web should not have underlines for none-links. And then there's
some websites which exactly reverse this approach... oh well.
--
Google Blogoscoped
http://blog.outer-court.com

[Stephen Poley]

On Thu, 25 Sep 2003 12:40:52 +0100, "Andrew Tang"
<An*********@ho tmail.com> wrote:

Hi, I need some help with understanding this piece of css.

<u>This is a <a href="#" style="text-decoration:none ;">hyperlink </a> with
surrounding underlining</u>

From what I understand of css, the styling in <a> should override its
parent. But it doesnt seem to work in this case, the whole sentence is still
underlined even though I have specifically specified no text-decoration. I'm
not saying its wrong but I really cant get my head around to why this is -
is this a case exception?

Btw, this only happens with Gekko (Mozilla) and Opera which follows the W3c
recommednati on properly. IE6 seems to render it as I would have expected
(with hyperlinks anyway).

The effect of switching underlining (or anything else) on in HTML and
off in CSS is AFAIK undefined, and consequently browser-dependent. If
you want consistency, use CSS throughout and don't use the HTML <U>
element.

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/

[Andrew Tang]

"Philipp Lenssen" <in**@outer-court.com> wrote in message
news:bk******** ****@ID-203055.news.uni-berlin.de...

Andrew Tang wrote:

<u>This is a <a href="#" style="text-decoration:none ;">hyperlink </a>
with surrounding underlining</u>

Do not use inline-styles!
Instead, use:
a:link, a:visited etc. { text-decoration... }

When you turn off text-decoration, make sure to find a good replacement
(like setting the link-color... and setting the back-color).

Sorry about the code, its the 'shorten version' so the page does clearly
define what a hyperlink is and is not. The problem with Mozilla and Opera
(which uses the w3c standard) is that 'Text-decoration: none' does nothing
when the parent has 'text-decoration:unde rline' (which is <u> in this case)
so it doesnt matter if it is inlined or not.

I just dont see why that is, when attributes such as 'background-color',
'color' and 'font-family' does exactly what it suppose to do whereelse
'text-decoration' follows its own rules!

Andy

[Andrew Tang]

"Stephen Poley" <sb*****@xs4all .nl> wrote in message
news:op******** *************** *********@4ax.c om...

On Thu, 25 Sep 2003 12:40:52 +0100, "Andrew Tang"
<An*********@ho tmail.com> wrote:

<u>This is a <a href="#" style="text-decoration:none ;">hyperlink </a> with
surrounding underlining</u>

The effect of switching underlining (or anything else) on in HTML and
off in CSS is AFAIK undefined, and consequently browser-dependent. If
you want consistency, use CSS throughout and don't use the HTML <U>
element.

Thanks for you answer but that isnt the problem. The code I given out is the
shorten version, I could have easily written:

<span style="text-decoration:unde rline;">This is a <a href="#"
style="text-decoration:none ;">hyperlink </a> with surrounding
underling</span>

and it still faces the same problem. The hyperlink is -still- underlined
even though I specifically said none so I assume its inheriting for some
reason. I'm trying to make w3c compliant code, thats why I dont understand
why Mozilla and Opera is doing this - so I'm just trying to understand it.

Andy

[Andreas Prilop]

On Thu, 25 Sep 2003, Johannes Koch wrote:

Additionally, don't underline text, which is no link.

This is a strange idea. Underlining is a valid typographic procedure
that is much older than hyperlinks; underline =|= link.

For example, I need <u>s</u> and <u>z</u> in
http://www.unics.uni-hannover.de/nhtcapri/arabic.html6

[Philipp Lenssen]

Andreas Prilop wrote:

On Thu, 25 Sep 2003, Johannes Koch wrote:

Additionally, don't underline text, which is no link.

This is a strange idea. Underlining is a valid typographic procedure
that is much older than hyperlinks; underline =|= link.

A valid typographic procedure on _paper_. And in many other digital
systems. Even in my email client. It is absolutely not common for
non-links on the Web, and highly confusing. Many metaphors or
approaches for offline-media won't work online. (By the way, this alone
doesn't mean you may _never_ have reason not to underline non-links.)

--
Google Blogoscoped
http://blog.outer-court.com

[Jim Dabell]

Andrew Tang wrote:

Hi, I need some help with understanding this piece of css.

<u>This is a <a href="#" style="text-decoration:none ;">hyperlink </a> with
surrounding underlining</u>

From what I understand of css, the styling in <a> should override its
parent. But it doesnt seem to work in this case, the whole sentence is
still underlined even though I have specifically specified no
text-decoration. I'm not saying its wrong but I really cant get my head
around to why this is - is this a case exception?

[snip]

Sort of. Text decoration applies to the whole element including its
children - so the value isn't inherited (and therefore cannot be
overridden) - but still has effect.

The CSS 2 specification isn't very clear on this:

<URL:http://www.w3.org/TR/REC-CSS2/text.html#linin g-striking-props>

However, the CSS 2.1 draft clarifies things, and I believe Mozilla has been
attempting to comply with that recently.

"Text decorations on inline boxes are drawn across the entire element, going
across any descendant elements without paying any attention to their
presence."

-- <URL:http://www.w3.org/TR/CSS21/text.html#linin g-striking-props>
--
Jim Dabell