Member Avatar for drfarzad

I'm using css menu in top of my page and i see menu is behind the image slider on IE but it working fine with firefox .
also my menu and footer text aligen is left on firefox but it's middle and top on IE . and i want in both of them left aligen like firefox .

  • 3 Contributors
  • 3 Replies
  • 89 Views
  • 5 Days Discussion Span
  • Latest Post Latest Post by macgurl70

Dani AI

Generated

— two different causes are likely: the menu falling behind the slider is a stacking/z-index or plugin (Flash) issue; the alignment differences between IE and Firefox usually come from DOCTYPE/quirks-mode or different default inline/block behaviors. 's text-align tip can fix submenu text when rules apply correctly, and 's IE-only stylesheet is a valid fallback if browser-specific tweaks are needed.

Troubleshooting checklist (fast):

  • Verify the slider type: right-click it — a Flash context menu indicates a Flash object. Flash content needs the wmode param set (for example opaque or transparent) so HTML can render on top; otherwise it will appear above all HTML. See Adobe docs for wmode.
  • Inspect stacking in the browser dev tools (F12): check position and computed z-index on the menu and all its positioned parents. A common fix is to make the nav (or its nearest positioned parent) explicitly positioned and give it a higher z-index, e.g. set the nav container to position: relative and a high z-index.
  • If alignment differs, ensure a standards DOCTYPE so IE is not in quirks mode, and make menu anchors block-level or give them explicit widths/line-height so different browser defaults do not move them.

References for how z-index/stacking contexts and quirks-mode behave: MDN - Understanding z-index and . If simple fixes fail, use an IE-only stylesheet (as suggested) after narrowing the exact cause with dev tools.

Recommended Answers

All 3 Replies

Member Avatar for ko ko

Use 'text-align' property for your sub-menu. It would like:

ul ul li a {
     text-align: left;
}

Hope this help!

Member Avatar for drfarzad

it dosn't work on IE yet ...

Member Avatar for macgurl70

IE lines up items differently, and I have found I actually need separate CSS comments for it to look like I want it to.

In my headers I put (and this is just a sample)

<html>
<title>testing</title>
<link href="Style.css" rel="stylesheet" type="text/css" />

<!--[if IE]><link href="ieStyle.css" rel="stylesheet" type="text/css" /><![endif]-->
<body>
text
</body>
</html>

Yes, it is two separate css stylesheets - but if it messes up in IE, I know which one to fix, and if in all the others - I fix the other file. This way, I can alter the settings for IE and not mess up my layout (except in IE).

Edited by macgurl70 because: n/a
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.