I need to have a css horizontal navigation where the sub-menus are also horizontal. The structure is working in ie but I can’t see the text or the :hover changes correctly – it works fine on all other browsers on mac/pc. I only have access to ie8 and below.
You can see it live here:
You can find the code for for the nav and nav css here:
Any help would be gratefully received as I can’t see where I am going wrong.
I have point-pointed the problem.
On the first level of the navigation is the css:
background: rgb(217, 217, 217) transparent;
background: rgba(255, 255, 255, 0.8);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#CCFFFFFF, endColorstr=#CCFFFFFF)";
to add transparency to the top level navigation. I might have to revert to using a png background instead of css.
That doesn’t work either. The only thing that works is manually unchecking that style in IE’s dev tools:
If I just don’t include that line it still doesn’t work???
I have now stripped out all the transparency and it is still not working, so it’s nothing to do with the css transparency coding.
I’ve now stripped out all the background colour, to the navigation, and the text is still hidden, until you click then it displays…
All I can think of it has something to do with a visibility, position or display css tag applied to some element somewhere
This seems to be a glitch in the way that my version of IE8 renders the css in my version of Parallels 6.0. I have been told that it renders correctly on a real PC and in someone elses version of Parallels in the standalone IE8 and in IETester?
Although IE still can’t handle the transparency code:
so I have stripped that out and IE just fallsback to a solid.
- The topic ‘Horizontal sub-menu navigation not working in IE8’ is closed to new replies.