Question

Am I missing something. I have the following CSS:

    <style = "text/css">
        .sidebar_qustions {padding: 10px; background-color: Green;}
        div.sidebar_qustions {padding: 10px;}
        DIV.sidebar_qustions {padding: 15px;}
        DIV .sidebar_qustions {padding: 20px;}
        ul.sidebar_questions_outer { list-style: none; margin: 0px; color: Red;}
        ul.sidebar_questions_inner { list-style: none; display:inline }
        li.sidebar_questions_inner { display:inline; padding: 5px; }
    </style>

When I have this code below then the sidebar_questions DIV doesn’t get styled:

<div id="sidebarwrapleft">
    <div id="sidebar">
            <div class="sidebar_questions">

I thought I could apply a style to the div so I tried a few different ways above but none of them work. Is it possible to apply a style to a DIV.

Hope someone can help.

Answer 1

You have misspelt .sidebar_questions in your css

in your css you have

.sidebar_qustions

and in your html you have

<div class="sidebar_questions">

For troubleshooting this sort of issue use Firefox and its plugin firebug. This will allow you to right click on the relevant part of your page and see the style being applied. If there is no style shown then this means that you either misspelt the name, or did not include the style sheet, or in this case made a mistake in defining your style sheet element.

You can look here for the correct WC3 recommendations as a reference.