CSS not working in Firefox [resolved]

**mrstuff68** · Dec 23rd, 2005, 10:26 AM

I have the following code on my page, but the CSS formating that I have does not show up in Mozilla Firefox. What am I doing wrong?

<head>
<LINK REL=StyleSheet HREF="Style.css" TYPE="text/css" MEDIA=screen>
</head>

**mendhak** · Dec 23rd, 2005, 06:50 PM

Looks fine. Show us the CSS file and the rest of your HTML.

**mrstuff68** · Dec 23rd, 2005, 06:59 PM

It works fine in IE but doesnt in Firefox.

Here is my html

HTML Code:

<head>
	<LINK REL=StyleSheet HREF="Style.css" TYPE="text/css" MEDIA=screen>
</head>
<body>
<table width="95%" align="center">
	<Tr>
		<Td>
<div align="center"><font class="header">Fitness Calculators</font></div>
<br><br>
<a href="http://www.exrx.net/Calculators.html">www.exrx.net/Calculators.html </a> 
		</TD>
	</TR>
</table>	
</body>
</html>

And this is my CSS file

[CSS]

.header
{
COLOR: #ac2b31;
FONT-FAMILY: Bauhaus 93;
FONT-SIZE: 18pt;
FONT-WEIGHT: normal;
}

.heading
{
COLOR: #00ABC7;
FONT-FAMILY: Bauhaus 93;
FONT-SIZE: 14pt;
text-decoration: underline;
}

body
{
margin-top: 0px;
margin-bottom: 0px;
scrollbar-3d-light-color: #00ABC7;
scrollbar-arrow-color: #ac2b31;
scrollbar-base-color: #00ABC7;
scrollbar-darkshadow-color: #00ABC7;
scrollbar-face-color: #00ABC7;
scrollbar-highlight-color: #ac2b31;
scrollbar-shadow-color: #ac2b31;
scrollbar-track-color: #00ABC7
}
[/CSS]

**penagate** · Dec 24th, 2005, 05:38 PM

If you are using XHTML you must enclose all attributes with quotation marks and all tags/attributes must be in lowercase as XML is case sensitive. You should not use <font> tags and you should specify things like width's in your CSS.

Although, none of that will cause the page to display incorrectly, it will simply be invalid XHTML, and if you are not using XHTML then it is perfectly OK. The unfortunate part is that CSS is also case sensitive

HTML Code:

<html>
    <head>
        <link rel="stylesheet" href="Style.css" type="text/css" media="screen">
    </head>
    
    <body>
        <table>
            <tr>
                <td>
                    <div align="center">
                        <span class="header">Fitness Calculators</span>
                    </div>
                    <br /><br />
                    <a href="http://www.exrx.net/Calculators.html">www.exrx.net/Calculators.html</a>
                </td>
            </tr>
        </table>
    </body>
</html>

CSS:

Code:

.header
{
    color: #ac2b31;
    font-family: Bauhaus 93;
    font-size: 18pt;
    font-weight: normal;
}

.heading
{
    color: #00ABC7;
    font-family: Bauhaus 93;
    font-size: 14pt;
    text-decoration: underline;
}

body
{
    margin-top: 0px;
    margin-bottom: 0px;
    scrollbar-3d-light-color: #00ABC7;
    scrollbar-arrow-color: #ac2b31;
    scrollbar-base-color: #00ABC7;
    scrollbar-darkshadow-color: #00ABC7;
    scrollbar-face-color: #00ABC7;
    scrollbar-highlight-color: #ac2b31;
    scrollbar-shadow-color: #ac2b31;
    scrollbar-track-color: #00ABC7
}

body table
{
    width: 95%;
}

**CornedBee** · Dec 25th, 2005, 07:40 AM

Open up the JavaScript console. See if there's a warning that says something like, "Style sheet declared as text/css, but actually is text/plain." If there is, you have a server misconfiguration.

Edit: Although looking at your HTML, I very much doubt Mozilla is in standards mode, so it wouldn't ignore the style sheet ...

**mrstuff68** · Dec 29th, 2005, 12:21 PM

Ok I figured it out myself.
Apprently I cant use the following in CSS: font-family: Bauhaus 93;
I put in the following line:FONT-FAMILY: "Bauhaus 93", Verdana, Helvetica, sans-serif;

And it works like a charm.

Thread: CSS not working in Firefox [resolved]

Thread Tools

Display

CSS not working in Firefox [resolved]

Re: CSS not working in Firefox

Re: CSS not working in Firefox

Re: CSS not working in Firefox

Re: CSS not working in Firefox

Re: CSS not working in Firefox

Posting Permissions