CSS classes for font-size not working in FF

  • Thread starter Thread starter Trevor L.
  • Start date Start date
T

Trevor L.

I have these classes in an external SS

..75pc , .sz10 {font-size: 10px ; } /* 10px=75% */
..50pc , .sz8 {font-size: 8px ; } /* 8px=50% */

I have this HTML code in a frame named "index_main"
<a
href="rss-reader.html?URI=http://abc.net.au/news/syndicate/topstoriesrss.xml"
target="index_main"
class="whitebg 75pc">
<img src="images/display/abc_banner_logo.gif"
alt="" width="40" height="24"/>ABC News RSS</a>

The text 'ABC News RSS' has a white background, but is not 10px

I proved this by changing the code to:
<a
href="rss-reader.html?URI=http://abc.net.au/news/syndicate/topstoriesrss.xml"
target="index_main"
class="whitebg 75pc"
onmouseover="toolTip('ABC News RSS',this)">
<span style="font-size:10px">
<img src="images/display/abc_banner_logo.gif"
alt="" width="40" height="24"/>ABC News RSS</a></span>
and the text was definitely smaller.

Is there some reason this wouldn't work as it was originally - without the
<span>. (It does in IE6)

I thought that a classname beginning with a numeral may the problem. This is
why I added sz10 as a duplicate class. So I tried
class="whitebg sz10" and this didn't work.

I then thought that perhaps FF's version of HTML/CSS (whatever) doesn't like
putting two classes together.
But changing the code to class="sz10 whitebg" made no difference, so clearly
the class "whitebg" is getting picked up

Also, this code gives blue underline text with white background but not a
smaller font:
<form id="eMailer" name="eMailer" action="">
<span class="whitebg 75pc blue uline" style="cursor:hand">
<a onclick="postform()">
As HTML
</a>........

</span>
</form>

Why is this happening?
I want to try to get all styles out of HTML and into CSS, so the fact that
it works with an in-line font doesn't help that much.
 
Trevor said:
I have these classes in an external SS

.75pc , .sz10 {font-size: 10px ; } /* 10px=75% */
.50pc , .sz8 {font-size: 8px ; } /* 8px=50% */

I have this HTML code in a frame named "index_main"
<a
href="rss-reader.html?URI=http://abc.net.au/news/syndicate/topstoriesrss.xml"
target="index_main"
class="whitebg 75pc">
<img src="images/display/abc_banner_logo.gif"
alt="" width="40" height="24"/>ABC News RSS</a>

The text 'ABC News RSS' has a white background, but is not 10px
Click to expand...

Some more info
This general style works
body { ...
font-family: verdana,arial,helvetica,sans-serif;
font-size: 13px; ..}

In some cases, I want 10px, so it would be nice to be able to define this in
a class and have it work.
 
Murray said:
Selector names cannot begin with a number, Trevor.
Click to expand...

Thanks, Murray

I thought that might be true so I tried using a different name but it didn't
seem to work.

I will have to try again as the names starting with a number may still have
been there when I tried and could have thrown it all out.

Another thing I tried was changing specs like this
class1 , class2 {spec1}
class1 {spec2}
class2 {spec3}

to
class1 {spec1; spec2}
class2 {spec1; spec3}

When using Firefox, it seemed to make a diifference.

Is there some CSS spec which says the first way to do it is incorrect or
only supported by some browsers?
 
I use
class1 , class2 {spec1}
class1 {spec2}
class2 {spec3}
for specifying styles for headings, where spec1 specifies colours, and
spec2 - spec6 specify fonts. No problems in any browser.
 
Trevor:

Ronx has the right idea here, bud, but -
Is there some CSS spec which says the first way to do it is incorrect or
only supported by some browsers?
Click to expand...

No.
 
Back
Top