CSS Style Sheet is Not Working?

Question

I have the following code in my stylesheet...

body 
{        
    background-image:url('Background.png');
}

td.Header
{
    background: purple Url("Header.png");
    height:100px;
    width:100%;
    border:5px;
    border-style:solid;
    border-color:blue;
}

Now This is how I use it in my html:

<table align="center" width="800px">
    <tr>
        <td class="header" height="100px">Where's my background and border?</td>
    </tr>
    <tr>
        <td>The Normal Stuff </td>
    </tr>
</table>

I do have my stylesheet linked to my html file. The only thing that works on my css sheet is my body class. My background image is appearing for my body. But for my td.header nothing at all is working. Please help.

Thanks Alot

Answer 1

Hi JCwhisman,

CSS class names are case-sensitive. If you change "td.Header" to "td.header", does it work?

Hope this helps!

Answer 2

your first problem is your css rule

td.Header

css is case sensitive so it should be the same case as your HTML:

td.header

second, in CSS you dont need to use quotes for urls. In fact i read somewhere that its better not to (cant recall where or i'd cite it :)

Answer 3

CSS can be case sensitive. If you are using the XHTML doctype, then CSS class names are case sensitive, so a class name of header is not the same as Header.

Check if you're using a doctype of XHTML. If so, you'll need to change your class attribute in the html to exactly match the class selector in the stylesheet.

If your DOCTYPE is HTML though, case sensitivity doesn't matter, and something else is going on.

Note that HTML5, like XHTML, will also be case sensitive.

Answer 4

in your css write td.header, because class names and ids are case-sensitive.