underlining <sup>

B

bernhard

Hey,

I try to to underline a <h4> header, which contains also superscripted
text:
<h4>product-name<sup>&reg;</sup></h4>
with this css:
h4 { text-decoration: underline; }

This works fine in Firefox, but in IE and Opera, the text decoration
gets
also superscripted, which looks very odd. For a better appearance, I
tried
to switch off underlining for the superscripted portion and added to
the css
h4 sup { text-decoration: none; }

This does not help, the superscripted portion appears still underlined
in
all 3 browsers.

Any idea?

Thx 4 ur help, Bernhard
 
T

Toby Inkster

bernhard said:
<h4>product-name<sup>&reg;</sup></h4>

This doesn't answer your question, but traditionally the registered
trademark symbol is used placed on the baseline with other text: not
superscripted. Ditto the copyright symbol.
 
T

Thomas Mlynarczyk

Also sprach bernhard:
<h4>product-name<sup>&reg;</sup></h4>
h4 { text-decoration: underline; }
This works fine in Firefox, but in IE and Opera, the text decoration gets
also superscripted, which looks very odd.
Any idea?

Instead of underlining, you could set a border-bottom for h1. Then, however,
the "underline" would stretch over the full width.
 
N

Neredbojias

With neither quill nor qualm, bernhard quothed:
Hey,

I try to to underline a <h4> header, which contains also superscripted
text:
<h4>product-name<sup>&reg;</sup></h4>
with this css:
h4 { text-decoration: underline; }

This works fine in Firefox, but in IE and Opera, the text decoration
gets
also superscripted, which looks very odd. For a better appearance, I
tried
to switch off underlining for the superscripted portion and added to
the css
h4 sup { text-decoration: none; }

This does not help, the superscripted portion appears still underlined
in
all 3 browsers.

Any idea?

Instead of <sup>, span the &reg; and use line-height and vertical-align
with font-size-adjust. (Untried regarding underline, though.)
 
B

bernhard

I tried that before, this obviously has the same visual effect as
<sup>, and also moves the underline to the new baseline
("superscripted").
I also like a clean markup, <span> controls appearance only, where
<sub> and <sup> have a semantic meaning.
 
B

bernhard

You're right with &copy;
But I disgree with &reg; and &tm; I think I have never seen those two
unsuperscripted. Maybe there are different rules depending on region /
country?
 
N

Neredbojias

With neither quill nor qualm, bernhard quothed:
I tried that before, this obviously has the same visual effect as
<sup>, and also moves the underline to the new baseline
("superscripted").

I see, although I was under the impression that a superscript baseline
was the same as its normal (parent) baseline.
I also like a clean markup, <span> controls appearance only, where
<sub> and <sup> have a semantic meaning.

True.
 
K

kchayka

Neredbojias said:
Instead of <sup>, span the &reg; and use line-height and vertical-align
with font-size-adjust.

Which browsers support font-size-adjust? IIRC, it was dropped from the
CSS 2.1 spec due to lack of support.
 
N

Neredbojias

With neither quill nor qualm, kchayka quothed:
Which browsers support font-size-adjust? IIRC, it was dropped from the
CSS 2.1 spec due to lack of support.

Interesting. I could think of other things about w3c css/html specs
they could at least change for the better, too.
 
L

Luigi Donatello Asero

Neredbojias said:
With neither quill nor qualm, kchayka quothed:


Interesting. I could think of other things about w3c css/html specs
they could at least change for the better, too.


For example?
 
N

Neredbojias

With neither quill nor qualm, Luigi Donatello Asero quothed:
For example?

No, it would be like arguing politics. Generally speaking, css is
mediocre and its implementation is mediocre on any browser to date,
which is in part due to its mediocre nature in the first place.

May times I've written a bit of css which renders differently in each of
the 3 major browsers even though all of the renderings may be
technically correct. Floats are a beauty, but that's just one thing
among many. The css model is poor and ambiguous, that's the real
problem.
 
J

Jukka K. Korpela

bernhard said:
You're right with &copy;
But I disgree with &reg; and &tm; I think I have never seen those two
unsuperscripted. Maybe there are different rules depending on region /
country?

They all appear in different shapes in different fonts. The registered sign
is particularly varying: sometimes a full-size "R" inside a circle, sometimes
a tiny little superscripted "R" in a circle.

Therefore, it should not be put inside <sup> markup. You might get extra
extra extra tiny symbol.

Simply use &reg; and leave it that, or leave the &reg; out. You probably
don't really need to use it in the first place, and you don't need to use it
in a _heading_ even if you need to mention once that that Foo is a registered
trademark of Bar.
 
L

Luigi Donatello Asero

Neredbojias said:
With neither quill nor qualm, Luigi Donatello Asero quothed:


No, it would be like arguing politics. Generally speaking, css is
mediocre and its implementation is mediocre on any browser to date,
which is in part due to its mediocre nature in the first place.

May times I've written a bit of css which renders differently in each of
the 3 major browsers even though all of the renderings may be
technically correct. Floats are a beauty, but that's just one thing
among many. The css model is poor and ambiguous, that's the real
problem.

You may be right.
 
T

Toby Inkster

bernhard said:
You're right with &copy;
But I disgree with &reg; and &tm; I think I have never seen those two
unsuperscripted.

For &reg;...

See the first paragraph under "Intellectual Property Licensing Policy
(Revised December 2003)" here:
http://www.microsoft.com/mscorp/ip/

First paragraph under "About the Netscape Network" here:
http://channels.netscape.com/info/tos.jsp

Very last paragraph here:
http://www.fox.com/corporate/terms.htm

Also:
http://www.whitepages.com.au/wp/legal/trademarks.html
http://www.unix.org/trademark.html (1st item on menu bar)
http://en.wikipedia.org/wiki/Trademark (search page for "Photoshop")
http://www.rbc.com/legal/trademark.html
http://www.apple.com/legal/trademark/appletmlist.html
http://www.chevrolet.com/copyright/ (search page for "NASCAR")
http://www.linuxmark.org/

For &trade;, you don't need to superscript, as most fonts automatically
raise the â„¢ sign off the baseline.
 
A

Alan J. Flavell

None of which I know.

I've seen something in Amaya. None of the "popular" browsers, anyway.

I don't think it does any harm on browsers that don't implement it,
but I wouldn't see any real point in using it in a general web page at
the moment.

A pity: implementing it could go a long way towards resolving the
notorious issues caused when an author specifies Verdana font.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,769
Messages
2,569,580
Members
45,054
Latest member
TrimKetoBoost

Latest Threads

Top