выступающая закладка

Ladoga · August 6, 2007

Привет народ. Оч нужна помощь. Проблема с выступающей закладкой в меню. Нужно чтобы активное меню вылазило вверх на 3 пункта. Проблема решается добавлением position:relative; но при этом при изменении размеров окна в IE меню сдвигается. Если убрать position:relative; то в IE6 выступающей части не видно

Помогите плиииизз решить эту проблему.

Код прилагаю:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<style>
#Header {
 clear:both;
 float:left;
 height:105px;
 width:100%;
}

#MenuBG {
 clear:both;
 float:left;
 width:100%;
 height:31px;
 margin-top:-4px;
}

#MenuToolbar {
 width:100%;
 margin-top:4px;
 height:27px;
 background-color:#ededed;
}

#MainMenu {
 float:left;
 height:27px;
 border-bottom:1px solid #000000;
 background-color:#b84d4d;
}

.ActiveMenu {
/* position:relative;*/
 float:left;
 padding-left:12px;
 padding-right:12px;
 margin-right:1px;
 border:3px solid #000000 !important;
 border-bottom:2px solid #000000 !important;
 height:26px !important;
 margin-top:-4px;
 line-height:2.25em;
}

.PassiveMenu {
/* position:relative;*/
 float:left;
 padding-left:13px;
 padding-right:13px;
 margin-right:1px;
 border:2px solid #990000;
 border-bottom:none;
 height:24px;
 line-height:2em;
}
</style>
</head>
<body>
 <div id="Header">
 <a href="#" class="PicLink"></a>
 </div>
 <div id="MenuBG">
 <div id="MenuToolbar">
 <div id="MainMenu">
 <a href="#" class="ActiveMenu MainMenu">MENU</a>
 <a href="#" class="PassiveMenu MainMenu">MENU</a>
 <a href="#" class="PassiveMenu MainMenu">MENU</a>
 <a href="#" class="PassiveMenu MainMenu">MENU</a>
 <a href="#" class="PassiveMenu MainMenu">MENU</a>
 <a href="#" class="PassiveMenu MainMenu">MENU</a>
 <a href="#" class="PassiveMenu MainMenu">MENU</a>
 </div>
 </div>
 </div>
</body>
</html>

{...отредактировано kiD}

yopopt · August 6, 2007

Это нормальное поведение плавающих блоков. Если не хватает места они сдвигаются вниз. Чтобы этого не было просто укажите необходимую ширину блоку #MainMenu.

Ladoga · August 6, 2007

В том-то и дело что места там полно. А сдвигаются они не вниз а вправо.

yopopt · August 6, 2007

В том-то и дело что места там полно. А сдвигаются они не вниз а вправо.

Специально проверил - вправо ничего не сдвигается. Возможно что-то другое мешает.

Ladoga · August 6, 2007

Воот я нашла что мешает. Если в стили добавить:

[codе]

body {

padding:0; margin:0 auto;

width:1020px;

}

[/codе]

.. то активное меню отодвигается вправо.

Но этот стиль нельзя убирать

Может кто знает что можно предпринять?

Заранее спасибо за ответы.

Ladoga · August 7, 2007

Ну что никто не знает? Или просто забили на тему?

Sign In

выступающая закладка

Question

Ladoga

Link to comment

Share on other sites

5 answers to this question

Recommended Posts

yopopt

Link to comment

Share on other sites

Ladoga

Link to comment

Share on other sites

yopopt

Link to comment

Share on other sites

Ladoga

Link to comment

Share on other sites

Ladoga

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information