Mon, 2012-02-20 21:13
I should probably be able to figure this one out, but I have been at it for days and cannot seem to make progress. I believe it is a css problem with li:hover and Internet Explorer. I am relatively new to css and to WordPress and am in the process of developing a site using a theme named Amphawa. I have found the theme difficult to use and, because I am not that proficient in css, the situation is even worse.
Here is the problem. The Navigation Bar I am developing using the tools within the theme seem to work in Firefox and Safari on both the PC and Mac. However, the second level "fly-out" menus are not working on Internet Explorer on the PC. To view the problem, you can go to the site at http://csl.chemicalsolutionsltd.com. Try and view the page in both Firefox and Internet Explorer and pay special attention when you hover over About Us and then Who We Are in the Nav Bar. In Firefox when hovering over Who We Are, you get a fly-out to the right reading Vision, Mission, Value and Staff. It does not appear in IE.
I think I have narrowed the problem down to li:hover and have found references to problems with this being unsupported in IE. All the fixes I have tried do not seem to work.
I was hoping someone might be able to look at the site and the css (http://csl.chemicalsolutionsltd.com/wp-content/themes/Amphawa/css/screen.css?ver=1.0) and give me some guidance about how I can resolve this issue. And please do keep in mind that I am not a css wizard, so try and keep it as simple as possible. I am truly at my wits end. Thanks.
