Second CSS class not working in IE8

I have the following div being rendered to th开发者_StackOverflowe client, but on IE, the checked-yes class is ignored. If I view the target element in the 'Developer Tools', that class is completely missing from the Style panel. The shift-item-present class is attached server side, and the checked-yes class client side, depending on the present attribute of the parent row, also shown below.

<td><div class="shift-item-present checked-yes" jQuery1272958392665="94"/></td>

Parent row:

<tr class="shift-item" id="ctl00_mainContentPlaceHolder_ctl00_shiftList_ctl01_shiftRow" present="True" shift-id="641" jQuery1272958392665="64">

The page works perfectly in FF. Here is the CSS, both in the same file:

.shift-item-present
{
    top: 2px;
    left: 2px;
    height: 12px;
    width: 20px;
    background-repeat: no-repeat;
    background-position: center right;
}

.checked-yes
{
    background-image: url('../Images/Icons/checked-yes-xs.png');
}

Internet Explorer does not support XHTML! Not even IE8. So it doesn't support self-closing elements. Use <div></div> not <div/>.

This may happen when IE8 renders the page in Quirks mode. Try to set a correct DOCTYPE.