I'm having trouble with the DNNmenu, where in FF3 the hover state of the root menu displays on the whole menu cell but in IE7, the hover (or active) only displays the image in a smaller sub-section of the cell - probably best to use illustrations...

From FF3 - which looks correct:

From IE 7:

The "Home" menu is active and the "updates" menu is selected (mouse hover).

Here is the css for "selected":

.main_dnnmenu_rootitem_selected  {
    font-family: Trebuchet MS, Tahoma, Helvetica, sans-serif;
    font-weight:600;
    text-align:center;
    font-size: 11px;
    text-transform:uppercase;
    color:#777777;       
    line-height:58px;
    background:url(JCO_Access_Active.gif) repeat-x center center ;
    padding:20px 0px 19px 0px;   }

Any ideas would ber very appreciated!

Cheers!

Using:  display:inline-block;

...solves the strange problems ofr the web-kit browsers, but the alignment of the select and hover states are off by 1 pixel in different directions (vertical) and I need different css hacks for each one. 

Does anyone know how to put mutilple conditional css stylesheets based on the browser into a dnn 4.08.04 skin?