Site dropdown menu does not work in IE8 compatibility mode - css

I am working on a site that has a menu that looks great in new browsers, and even IE8 on vista, however in IE8 compatibility mode or in XP for example, the navigation does not work.
I've made a jsfiddle here to see what I mean (sorry, am in a hurry; hover over the "result" part and you'll see the dropdown in action)
http://jsfiddle.net/K3PFd/
It just doesn't work in compatibility mode or I'm assuming older versions of IE. Of course the client is using IE8 which is why I have to fix this...
Can you PLEASE help?

Related

CSS Menu Not working with XML rotating Banner

I tested Nvidea css drop down menu on a site with XML Flash rotating banner , it works find on opera but doent work on internet explorer and google chrome, it actually goes behind.
menu from : http://www.lwis.net/free-css-drop-down-menu/
see link here: http://sonymax.co.uk
thx
Seems there is a problem with the menu actually, I removed the banner in IE and the drop-down menu still doesn't show up. Also note, that if you change your compatibility mode from IE7 to IE8 or 9 the menu and banner are way off. You should revise your code a bit.
It works in my Chrome, not sure why it doesn't in yours, only IE has the problem as far as I tested.

Does the "AlternatingItemTemplate" work in windows explorer 9?

The following code with alternating background I have shows up fine in Chrome and Firefox but not IE9:
If IE9 does support it, what am I missing?
Here is the output in Chrome and in IE9 respectively. Notice the grayish background missing on IE9
Internet Explorer, or any other browser for that matter, has no knowledge of AlternatingItemTemplate. It's part of a server-side control. ASP.NET renders the AlternativeItemTemplate's contents when it's an alternate row.
As far as your background color not working, I recommend using the Developer Tools and tracing the style to determine why it isn't visible.

css position error IE8/IE9

Im developing a small web app, but i'm having problems with different browsers.
It seems ok on Chrome, Firefox,
but in IE9 (compatibility mode) the Div menu doesnt position the same way that the other browser,
also in IE9 (normal mode) it position ok the Div menu, but the div below the menu does not appear ok.
the site: http://tinyurl.com/3nmkxjs
Does anyone have an idea?
Thanks in advance!
Joao
Having problems with IE is normal and expected. It's an inept browser.
Remove all the spaces before the doctype to make sure that's not putting IE into quirks mode. I thought that problem was fixed in IE8, though.

IE9 Document Mode Toggle fixes SharePoint CSS issues?

I'm working on my first SharePoint project doing some UX support. My client's page uses some custom css including a horizontal main-menu with dropdown sub-menus. When the page is loaded in IE9, none of the sub-menus work correctly. The dropdowns appear when you hover over the top-level item but when you drop your cursor down to the sub-menu, the hover doesn't register and the menu disappears.
These links work fine in latest versions of Chrome and Firefox, so I'm pretty sure this is an IE quirk. In IE9, if I open the developer tools and toggle the document mode from IE9 to IE7 and then back to IE9, the menus work correctly for the remainder of the browser tab's lifetime (e.g. when I use the sub-menus to navigate to other pages, the dropdowns continue to function properly). Unfortunately, since this is SharePoint, I don't have a lot of control over the structure of the html here.
Anyone know what might be going on? Does anyone know the impact of toggling the browser modes to IE7 and back and why that might fix the problem? Thanks!
Try this:
<meta http-equiv="X-UA-Compatible" content="IE=7">
It will force IE8, IE9 etc to render as if they were IE7.

css rollover buttons- great in safari,and firefox/ ie but not chrome?

i've been trying out a bit of code posted to make image rollover buttons using only css,
this seems to work fine.
local testing showed no problems, IE, Firefox, safari all ok. even chrome displays as intended on the local version.
Once i move to a hosted test, IE, Firefox and Safari all display as intended but chrome offsets all the buttons right about 8-10 pixels.
here's the test page
http://www.fierysurprise.pwp.blueyonder.co.uk/bga/bgd.html
can anyone enlighten me as to what's happening?
site built in Kompozer
I assume you're referring to the squares under the "architectural design..." phrase.
I can't recreate this problem in Chrome v5.0.375.125.
What version of chrome are you using? Chrome tends to doggedly cache resources. Have you tried a cache refresh?
What version of Chrome are you using? I looked at your site in Chrome 5 and can't seem to tell a difference between any of the browsers you've mentioned.

Resources