- This topic is empty.
December 6, 2013 at 11:14 am #157886owlinargyleParticipant
We have a UL menu that works perfectly in IE 10, but won’t work in IE8. Here is the code: Codepen
I’m not sure if it’s a CSS issue or an something else, as we’d recently made some changes to our site in order to conform to WCAG standards; such as adding a DOCTYPE. We’ve tried
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">.
The browser also keeps requiring us to change it out of Compatibility settings to make various other visual settings display correctly. Such as no longer centering the entire design. (Our site is not a responsive design site.)
I am clearing the browser cache and refreshing each time I retest my changes in the browser, but nothing I’ve tried is having any effect on the menu.
If anyone has some insight on this, I would really appreciate it. I’m trying to fix this by COB so we don’t have to back out the changes. =(
THANKS!December 6, 2013 at 12:49 pm #157894jkinney768Participant
Why not use html5 doctype?
Do you have a link to an actual demo of the page? CSS wouldn’t be changing your compatibility settings, usually it’s something else. I’ve had a similar issue to what you’re describing and it turned out to be an issue using Modernizr. If you have a link to a demo, that would help us be able to solve it faster.December 6, 2013 at 1:28 pm #157895owlinargyleParticipant
I provided a link to my code pen, because its a secure site I’m working on.
Yeah, it’s not the DOCTYPE afterall. When I went back to my test site, it was working fine. Turned out it was how IE8 was interpreting the positioning of the DIVs that come before the UL elements, because not all of the CSS elements had been properly copied over. Apparently, my teammate was copying my code over line by line instead of copying the entire file. /eyeroll
Anyway, it’s all worked out now. =)December 6, 2013 at 2:55 pm #157898MerriParticipant
My eyes paid attention to the 1px difference between #newMenu and the menu items.
So I fixed that, removed “noise styles” that I considered unnecessary and also commented what everything does. Changed font-sizes to both px and rems to introduce those as a plausible solution to the
Now the links determine the height of #newMenu ul and thus the height of the #newMenu as well. This makes it easier to restyle.
- The forum ‘CSS’ is closed to new topics and replies.