Hello,

I am having a problem with my site in IE8 Compatibility mode. Below is a URL where you get the basic idea of what my websites dropdowns look like. The dropdowns are done in CSS and when you hover over one dropdown the submenu for the dropdown expands under the dropdown to the right of it. It works correctly in Safari, Chrome, Firefox, and normal IE8. But when you go to compatibility mode it isn't working correctly. Any help would be much appreciated.

http://jsfiddle.net/h5xZT/28/

Thanks

4 answers

danwellman 5600
1
point
This was chosen as the best answer

Add a doctype to the page.

Change the styles to this:

 #cssdropdown li>ul {
        top: 30px;
        display:none    
}


      #cssdropdown li ul {
            left: 0;
    }

    #cssdropdown li:hover ul, #cssdropdown li:focus ul, #cssdropdown li.sfhover 

    ul {
            left: 0;
            display: block;
    }

I only changed the styles listed above. I updated the fiddle again for you

This works in my IE8 compat mode...

Answered over 5 years ago by danwellman
danwellman 5600
0
points

Its the left:-999em; style rule that seems to be killing it in IE7/compatibility mode

I updated the fiddle for you, seems ok now...

Answered over 5 years ago by danwellman
0
points

When I go to the fiddle that I put in above it is still not working in IE8 compatibility mode. I tried updating the -999em style to other things and it still wouldn't work. If you can test out the fiddle again it does not appear to work in IE8 in compatibility mode.

Answered over 5 years ago by Brant Smith
0
points

Thanks Dan that worked for me.

Answered over 5 years ago by Brant Smith