4 replies [Last post]
jmmiljours
jmmiljours's picture
Offline
newbie
Last seen: 10 years 18 weeks ago
Timezone: GMT-5
Joined: 2011-01-11
Posts: 4
Points: 5

I need some help whit stran bug in only a IE7 bug the menu is behind other button
Here is a live example :

i do relly aprichiate your help

sorry for the bad english

and then the css code here:

#menu
{
	position: relative;
	margin: -75px 0 0 0;
	background:url(../images/bg_menu.png) left top no-repeat;
	width: 415px;
    height: 152px;
	float: left;
	z-index:100;
}
 
#menu div
{	
	margin:-1px 0 0 0;
}
 
#menu .moduletable_menu .menu
{
    float: left;
	position: relative;
	margin:1px 0 0 -2px;
    padding: 0;
	list-style:none;
}
 
#menu .moduletable_menu2 .menu
{
    float: left;
	position: relative;
	margin:0 0 0 -25px;
    padding: 25.5px 0 0 0;
	list-style:none;
}
 
#menu .moduletable_menu3 .menu
{
    float: right;
	position: relative;
	margin:-75px 0 0 105px;
    padding: 0;
	list-style:none;
}
 
#menu .menu li
{
    text-decoration: none;
	display:block;
	height: 50px;
    width: 155px;
	background: url(../images/bnt_menu.png) no-repeat;
    margin-right: 1px;
    color: #24702b;
	position:relative;
}
 
#menu .menu li a
{
    display: block;
    color: #333;
    text-decoration: none;
    font: 1em "Trebuchet MS" ,Arial,sans-serif;
    font-weight: bold;
    line-height: 3em;
    text-align: center;
    height: 50px;
    width: 155px;
}
 
#menu li:hover a
{
	color:#fff;
}
 
#menu .menu li:hover
{
	background:url(../images/bnt_menu_hover.png);
	color:#fff;
}
 
#menu .menu ul
{
	background:url(../images/menu_hover.png) no-repeat;
	display:none;
	color:#FFFFFF;
	height:157px;
	width:257px;
	list-style:none;
	margin:0;
	padding:25px 0 0 0;
	position:absolute;
	top:25px;
	left:13px;
}
 
#menu .menu li:hover ul
{ 
	display:block;
	z-index:999;
}
 
#menu .menu ul li
{
	background:none;
}
 
#menu .menu ul li:hover
{
	background:none;
}
 
.menu li span a { display: block; }
 
.menu ul li
{
    text-decoration: none;
    list-style: none;
    float: left;
    width: 158px;
	height:30px;
    margin-right: 1px;
    color: #24702b;
}
 
.menu ul li a
{
    display: block;
    color: #333333;
	background:none;
    text-decoration: none;
    font: 0.8em "Trebuchet MS" ,Arial,sans-serif;
    font-weight: bold;
    line-height: 1.9em;
    text-align: center;
    height: 10px;
}

jmmiljours
jmmiljours's picture
Offline
newbie
Last seen: 10 years 18 weeks ago
Timezone: GMT-5
Joined: 2011-01-11
Posts: 4
Points: 5

Exemple

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 6 years 31 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

You may need to set a z-index

You may need to set a z-index on .menu or .menu li and the submenus.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

jmmiljours
jmmiljours's picture
Offline
newbie
Last seen: 10 years 18 weeks ago
Timezone: GMT-5
Joined: 2011-01-11
Posts: 4
Points: 5

here the link link

nah i put a z-index and it'n work to that strange

#menu
{
	position: relative;
	margin: -75px 0 0 0;
	background:url(../images/bg_menu.png) left top no-repeat;
	width: 415px;
    height: 152px;
	float: left;
	z-index:100;
}
 
#menu div
{	
	margin:-1px 0 0 0;
}
 
#menu .moduletable_menu .menu
{
    float: left;
	position: relative;
	margin:1px 0 0 -2px;
    padding: 0;
	list-style:none;
}
 
#menu .moduletable_menu2 .menu
{
    float: left;
	position: relative;
	margin:0 0 0 -25px;
    padding: 25.5px 0 0 0;
	list-style:none;
}
 
#menu .moduletable_menu3 .menu
{
    float: right;
	position: relative;
	margin:-75px 0 0 105px;
    padding: 0;
	list-style:none;
}
 
.menu
{
	z-index:1;
}
 
#menu .menu li
{
    text-decoration: none;
	display:block;
	height: 50px;
    width: 155px;
	background: url(../images/bnt_menu.png) no-repeat;
    margin-right: 1px;
    color: #24702b;
	position:relative;
    z-index:1;
}
 
#menu .menu li a
{
    display: block;
    color: #333;
    text-decoration: none;
    font: 1em "Trebuchet MS" ,Arial,sans-serif;
    font-weight: bold;
    line-height: 3em;
    text-align: center;
    height: 50px;
    width: 155px;
}
 
#menu li:hover a
{
	color:#fff;
}
 
#menu .menu li:hover
{
	background:url(../images/bnt_menu_hover.png);
	color:#fff;
}
 
#menu .menu ul
{
	background:url(../images/menu_hover.png) no-repeat;
	display:none;
	color:#FFFFFF;
	height:157px;
	width:257px;
	list-style:none;
	margin:0;
	padding:25px 0 0 0;
	position:absolute;
	top:25px;
	left:13px;
        z-index:10;
}
 
#menu .menu li:hover ul
{ 
	display:block;
	z-index:999;
}
 
#menu .menu ul li
{
	background:none;
}
 
#menu .menu ul li:hover
{
	background:none;
}
 
.menu li span a { display: block; }
 
.menu ul li
{
    text-decoration: none;
    list-style: none;
    float: left;
    width: 158px;
	height:30px;
    margin-right: 1px;
    color: #24702b;
}
 
.menu ul li a
{
    display: block;
    color: #333333;
	background:none;
    text-decoration: none;
    font: 0.8em "Trebuchet MS" ,Arial,sans-serif;
    font-weight: bold;
    line-height: 1.9em;
    text-align: center;
    height: 10px;
}

jmmiljours
jmmiljours's picture
Offline
newbie
Last seen: 10 years 18 weeks ago
Timezone: GMT-5
Joined: 2011-01-11
Posts: 4
Points: 5

Jquerry

Solved