Question

This algorithm just stopped working on my page (it had worked for over a year as it was):

<div class="classA" id="specific1">
    <a href="#">Link Text</a>
</div>

.classA a {
    style: actual style;
}

The a tag no longer picks up the style in the css. Now in order for my a tags to pick up the style I have to give them a class specifically and this works:

<div class="classA" id="specific1">
    <a class="classB" href="#">Link Text</a>
</div>

Did something change recently in IE7 or FireFox4 that would break the first algorithm? I’d prefer to fix the css rather than inserting a class onto all of the relevant a tags on several pages.

Edit to show better the actual styling:

This no longer works (links have vanilla 100%-blue-underline styling) but had been working for quite some time. Note that it was first designed for IE6, survived the switch to IE7, but has subsequently stopped picking up its style. Hopefully this helps all of you who have graciously tried to answer!

-- HTML --
<div class="ovalButton" id="oval1"><a href="#">LinkText</a></div>       

-- CSS --
* {
    margin: 0;
    padding: 0;
    overflow: hidden;
    font-family: verdana, arial, sans-serif;
}

.ovalButton {
    position: absolute;
    width: 150px;
    height: 60px;
}

.ovalbutton a {
    background: url("logo_butn.gif") no-repeat;
    display: block;
    color: #0063B5;
    width: 150px;
    height: 60px;
    overflow: hidden;
    font-size: 80%;
    font-weight: bold;
    text-decoration: none;
    padding: 16px 15px 20px 0;
    text-align: center;
}

.ovalbutton a:Hover { background: url("logo_butn_highlight.gif") no-repeat; }

#oval1 { top: 12px; left: 300px; }
#oval1 a { padding-top: 25px; }

When I copy the exact styling from .ovalbutton a {} to a separate class and apply that class to the link in the html, it works fine.

Answer 1

The problem is here:

.ovalbutton a {

The capitalization does not match:

<div class="ovalButton" 

You can change your CSS selector to .ovalButton a to fix this problem.