IE7 with Dropdown menu cutting with other elements?

Up vote -1 down vote favorite share g+ share fb share tw.

In internet explorer 7, the top horizontal menu displays the subcategories under the div tags on the page. The menu's items are either positioned relative or absolute and the z-index is higher than the div tags'. How do I make the dropdowns appear in front of everything else in the page then?

Please have a look luxos.com in iE7 Browser, Please help me it seems no way to go out from this here is CSS code whis I am using for IE7 CSS #head-nav { height: 35px; right:149px;} #head-nav li{ position: relative; } #head-nav li . Subnav{z-index:99999;} . Subnav-viewport {z-index:99999;} Here is the code which is for all other browsers ul#head-nav {font-family:Arial, Helvetica, sans-serif;font-size: 13px;position: absolute;top: 104px;letter-spacing: .1em;} ul#head-nav li {float:left;margin:0px 1px 0px 0px;padding: 0;position:relative;} /*ul#head-nav li a {color:#000;text-decoration:none;padding:0 0 3px 0;font-weight:300;} ul#head-nav li a:hover {border-bottom:5px solid #ccc}*/ /*---------------------New Menu navigation system 02/08/2010--------------*/ /*.

Menubutton{background:url("../images/menu-button-slice. Jpg") no-repeat scroll right 0 transparent;padding:0px 4px 0px 0px;display:inline-block;} . Menubutton a{background:url("../images/menu-button.

Jpg") no-repeat scroll 0 0 transparent;color:#FFFFFF;padding:0px 9px 0px 15px;display:inline-block;height:25px;line-height:23px;}*/ /*---------------------Menu Buttons changed 23/02/2011----------------------*/ . Menubutton{background:#58595b;padding:0px;display:inline-block;width:150px;text-align:center;} . Menu-down-button{background:url("/interface/images/menu-down.

Jpg") no-repeat scroll 124px 8px #58595b;padding:0px;display:inline-block;width:150px;text-align:center;} . Menubutton a{color:#FFFFFF;display:inline-block;height:25px;line-height:23px;} ul#head-nav li . Subnav{width:150px;position:absolute;background:#ffffff;padding:4px 0px;margin:0px;display:none;z-index:99;background: url("/interface/images/menu-dropdown-bg.

Gif") repeat-y 0 0;border-bottom:1px solid #cfcfcf;} ul#head-nav li . Subnav li {float:none;padding:0px;margin:0px;display:block;height:20px;} ul#head-nav li . Subnav li.

Menu-divider {border-top:1px dashed #444444;width:120px; display:block;height:2px;margin:4px 7px;} ul#head-nav li . Subnav a, . Menu-title{color:#808080;font-family:Helvetica,Arial,"Liberation Sans","Bitstream Vera Sans",sans-serif;font-size:12px;display:block;padding:0px 8px;;margin:1px 0px 1px 0px;letter-spacing:0;} ul#head-nav li .

Subnav a:hover{background:#444444;color:#ffffff;} . Subnav-viewport {display:none;position:absolute;height:457px;width:136px;overflow:hidden;z-index:999;left:0;top:19px;background: url("/interface/images/subnav-viewport-arrow-bg. Gif") no-repeat 0 0;padding-top:8px;} .

Subnav-viewport li. Down{} . Subnav-viewport li.

Up{} . Menu-title{font-weight:bold;padding:0px 8px! Important;} .

Menu-bold{font-weight:bold;} ul#head-nav li . Subnav li. Menu-underline a{text-decoration:underline;} css internet-explorer-7 link|improve this question edited Jan 12 at 11:34Bart4,9593813 asked Jan 12 at 11:20user114529883 50% accept rate.

Your page is suffering from an IE7 bug. In this specific case, you can fix it by following these steps: On #head-nav, add z-index: 1. On #header, remove position: relative.

Unfortunately, your header is now slightly broken. To fix it, on a#head-logo change bottom: 63px to top: 28px.

Meta.stackoverflow.com/a/5235/155050 – thirtydot Jan 12 at 18:39.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.