главное меню в IE 8.0

beznika · April 17, 2012

Добрый день. Сделал шаблончик первый в моей жизни.

во всех нормальных браузерах всё работает, в ие8.0 не ракрываются при наведении кнопки меню, только если ведёшь мышкой вниз по кнопке, и при раскрытии часть кнопок остаётся за нижним модулем, хотя должны быть сверху. и ещё проблема страницы товаров с картинками именно в ие80 не прокручиваются вниз, если картинок нет то всё крутится.

вот css меню

#topmenu .menu{
	background:url(../images/menu_bg.gif) repeat-x left;
	list-style:none;
	position: relative;
	margin-left:auto;
	margin-right:auto;
	width:1042px;
	height:85px;
	margin-bottom:-30px;
	border-radius:15px 15px 0 0;
    -moz-border-radius:8px 8px 0 0;
    box-shadow:5px -5px 10px 0px#904d30;
    -moz-box-shadow: 5px -5px 10px 0px #904d30; /* Для Firefox */
	-webkit-box-shadow: 5px -5px 10px 0px#904d30; /* Для Safari и Chrome */
	border-left: solid 1px #904d30;
	border-right: solid 1px #904d30;
	border-top: solid 1px #904d30;
	border-bottom: 0px;
	z-index:1;
}
#topmenu .menu li a{ text-decoration:none; }
#topmenu .menu li{
	background:url(../images/menu_kn1.gif) no-repeat center ;
    list-style:none; 
	text-align: center;
	margin-top: 15px;
	margin-left: 9px;
	min-width:19%;
    line-height:40px;
    display:inline-block;
	//display: inline;
	zoom: 1;
    font-size:18px;
    }

#topmenu .menu li.selected{
    background:url(../images/menubg.gif); # repeat-x left top #ffffff;
}

#topmenu .menu li.selected a.selected{
    color:#4a3008; /*цвет ссылки меню активной страницы*/
    text-decoration:none;
}

#topmenu .menu li a:hover,
#topmenu .menu li a.hover{
    color:#4a3008 !important;
	display:inline-block;
}

#topmenu .menu li a{
    color:#4a3008;
    height:40px; 
    line-height:40px;
    display:inline-block;
}

#topmenu ul li ul {
    display:none;
    position: absolute;
    top: 40px;
	width: 180px;
	height:40px;
	color: #000;
    padding:0px;
    z-index:1000;
}
#topmenu ul li ul li ul {
    display:none;
    position: relative;
    left:200px;
	width: 200px;
	color: #000;
    padding:0px;
    z-index:1000;
}

#topmenu ul li ul li {
	display:none;
    position: relative;
    margin-bottom:-15px;
	width:100%;
	padding:0px;
    z-index:1000;
}

#topmenu ul li ul li a{
    display:block;
    width:100%;
}
#topmenu ul li ul li a{
    padding:0px !important;
}
#topmenu ul li ul li a span{
    margin:0px 10px;
    padding:0px;
}
#topmenu ul li ul li a.selected span{
    text-decoration:none;
}
.pathway{
    padding:0 20px 10px;
    color:#FFFFFF;
}
.pathway a{ color:#a27a4e; }
.pathway a:hover{ color:#878787; text-decoration:none; }

надеюсь на помощь. спасибо.

Edited April 17, 2012 by rus
Используйте для оформления кода BB теги форума.

rus · April 17, 2012

Что это такое?


<div class="modulebody">
<link type="text/css" rel="stylesheet" href="/includes/jquery/treeview/jquery.treeview.css">
<div>
</div>

:blink:

beznika · April 17, 2012

стили товаров видимо, сам шоп не я писал, я только шаблон делал.

а причем тут меню?

Edited April 17, 2012 by beznika

rus · April 17, 2012

стили товаров видимо, сам шоп не я писал, я только шаблон делал.
а причем тут меню?

я о том, где вообще должны быть прописаны пути для стилей!

для начала это исправьте.

beznika · April 17, 2012

это отдельные модули со своими стилями, в моём шаблоне нет этих строчек я их не писал, и незнаю где они находятся, это вопрос к разработчикам instantshop.

давайте предположим что там всё правильно и вернёмся к моему вопросу?

beznika · April 18, 2012

всем спасибо, разобрался сам. ниже исправленный код.

#topmenu .menu{
	background:url(../images/menu_bg.gif) repeat-x left;
	list-style:none;
	margin-left:auto;
	margin-right:auto;
	width:1042px;
	height:85px;
[b]#	position: relative;[/b]
	margin-bottom:-30px;
	border-radius:15px 15px 0 0;
    -moz-border-radius:8px 8px 0 0;
    box-shadow:5px -5px 10px 0px#904d30;
    -moz-box-shadow: 5px -5px 10px 0px #904d30; /* Для Firefox */
	-webkit-box-shadow: 5px -5px 10px 0px#904d30; /* Для Safari и Chrome */
	border-left: solid 1px #904d30;
	border-right: solid 1px #904d30;
	border-top: solid 1px #904d30;
	border-bottom: 0px;
}
#topmenu .menu li a{ text-decoration:none; }
#topmenu .menu li{
	background:url(../images/menu_kn1.gif) no-repeat center ;
    list-style:none; 
	text-align: center;
	margin-top: 15px;
	margin-left: 9px;
	min-width:19%;
    line-height:40px;
    display:inline-block;
	zoom: 1;
    font-size:18px;
 [b]   position: relative;[/b]
}

#topmenu .menu li.selected{
#	opacity: 1.0;filter:alpha(opacity=100);zoom:1;
#    background:url(../images/menubg.gif); # repeat-x left top #ffffff;
}

#topmenu .menu li.selected a.selected{
    color:#4a3008; /*цвет ссылки меню активной страницы*/
    text-decoration:none;
 #   text-shadow:0 1px 0 #000; /*тень ссылки меню активной страницы*/
}

#topmenu .menu li a:hover,
#topmenu .menu li a.hover{
#    background:url(../images/menubg-hover.gif); # repeat-x center top #ffffff; /*фоновый рисунок активной кнопки главного меню*/
    color:#4a3008 !important;
#    text-shadow:0 1px 0px #000 !important;
#	display:inline-block;
}

#topmenu .menu li a{
#    padding:5px 5px;
    color:#4a3008;
    height:40px; 
    line-height:40px;
    display:inline-block;
}


#topmenu ul li ul {
    display:none;
    position: absolute;
    top: 25px;
    //left:0;
	width: 180px;
	height:40px;
#	background: #F2dfb6;
	color: #000;
    padding:0px;
    z-index:1000;
#    box-shadow:1px 1px 3px #000;
#    -moz-box-shadow:1px 1px 3px #000;
}
#topmenu ul li ul li ul {
    display:none;
    position: relative;
    left:200px;
	width: 200px;
	color: #000;
    padding:0px;
    z-index:1000;
}

#topmenu ul li ul li {
	display:none;
    position: relative;
    margin-bottom:-15px;
	width:100%;
	padding:0px;


}

#topmenu ul li ul li a{
    display:block;
    width:100%;
	padding:0px !important;


}

#topmenu ul li ul li a span{
    margin:0px 10px;
    padding:0px;

}

#topmenu ul li ul li a.selected span{
    text-decoration:none;

}

.pathway{
    padding:0 20px 10px;
    color:#FFFFFF;

}

.pathway a{ color:#a27a4e; }
.pathway a:hover{ color:#878787; text-decoration:none; }

плюс то что небыло в первой части, стиль следующего модуля

#topwide{
    background:url(../images/topbg.png) no-repeat left bottom #a27a4e;
#	opacity: 1.0;filter:alpha(opacity=100);	zoom:1;
	text-align: center;
	font-style: italic !important;
#	background:#a27a4e;
	[b]position: relative;[/b]
    display:block;
    overflow:hidden;
    border-radius:10px 10px 0 0;
    -moz-border-radius:10px 10px 0 0;
    margin-bottom:5px;
#    margin-top:10px;
    box-shadow:5px 5px 10px 0px#904d30;
	-moz-box-shadow:5px 5px 10px 0px#904d30;
	-webkit-box-shadow:5px 5px 10px 0px#904d30;
    width:1042px;
    border-bottom:solid 1px #904d30;
	border-right:solid 1px #904d30;
	border-left:solid 1px #904d30;
	background-size: 100%;
	-webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
	[b]z-index:-1;[/b]
}

Edited April 18, 2012 by beznika

Sign In

главное меню в IE 8.0

Question

beznika

Link to comment

Share on other sites

5 answers to this question

Recommended Posts

rus

Link to comment

Share on other sites

beznika

Link to comment

Share on other sites

rus

Link to comment

Share on other sites

beznika

Link to comment

Share on other sites

beznika

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information