Question

If I have a style class defined as such:

.myclass{
    //bunch of other stuff
    float:left;
}

and I define another class like this:

.myclass-right{
    float:right;
}

and I define a div this way:

<div class="myclass myclass-right"></div>

Will that div inherit everything from myclass, but override the float property to float:right? That’s what I’d expect to happen. Also kind of want to know if that has any cross-browser implications (good browsers vs. IE 7 or greater, f*** IE6).

Answer 1

As long as the selectors have the same specificity (in this case they do) and .myclass-right style block is defined after .myclass, yes.

Edit to expand: the order the classes appear in the html element has no effect, the only thing that matters is the specificity of the selector and the order in which the selectors appear in the style sheet.