ie6 замучал меня

VoVa · April 7, 2008

между блоками только в ие6 появляется горизонтальный разрыв в 3 рх

как с этим бороться?

выравнивание стоит float:left и clear:both

ZoNT · April 7, 2008

убей тех, кто пользуется IE6 и будет тебе счастье!

VoVa · April 7, 2008

ммм я верстальщик а не писатель вирусов )))

ZoNT · April 7, 2008

тогда поищи поиском на этом форуме про 3х пиксельный баг

VoVa · April 7, 2008

в том то и дело насколько я знаю 3х пиксельный баг появляется при вертикальном блоке а у меня горизонтальный.искал я это баг не нашел ничего=(

Константин · April 7, 2008

Немного отрицательных маргинов и хаков для разных браузеров и вс? пройдет!

Storm · April 8, 2008

Код покажи

VoVa · April 8, 2008

просто отрицательные маргины нельзя в опере косяк получается.

вот код

<div id="menu1">
<ul id="menuList">
<li class="menuWrite"><a href="">Главная</a></li><img src="images/razd.gif" hspace="10" align="top" class="img" />
<li class="menuWrite"><a href="">Новости</a></li><img src="images/razd.gif" hspace="10" align="top" class="img" />
<li class="menuWrite"><a href="">Магазин</a></li><img src="images/razd.gif" hspace="10" align="top" class="img"/>
<li class="menuWrite"><a href="">Контакты</a></li><img src="images/razd.gif" hspace="10" align="top" class="img"/>
</ul>
<form action="" class="searchButton" id="search">
<input type="submit" class="searchButton"src="images/search.jpg" alt="поиск" value="Поиск"/>
<input type="text" class="searchMenu" maxlength="30" size="25" />
</form>
<img src="images/korzina.gif" align="top" id="korz"/>
</div>
</div>
<!--Menu-->
<div id="menu">
<a href=""><img src="images/leftvverh.gif" alt="1" /></a>
<a href=""><img src="images/middleverh.gif" id="second" alt="2"/></a>
<a href=""><img src="images/rightVerh.gif" id="third" alt="3"/></a>
<p class="contentWrite">Главная</p>
</div>
<!--Content-->
<div id="content">

</div>
#content{
 background-image:url(../images/cer.gif);
 background-repeat:repeat-y;
 clear:both;
 float:left;
 height:700px;
 margin:0;
 padding:0px;
 width:821px;
}
#menu{
 clear: both;
 float: left;
 margin: 0px;
 height:216px;
 padding: 0px;
 width:830px;
}

#menu1{
 height: 20px;
 padding-left: 0px;
 width:710px;
}

между контентом и меню только в ие6 появляется горизонтальный разрыв

Storm · April 8, 2008

1. Если пишешь код, обрамляй его в соответствующие теги.

2. В приведенном коде лишний , будь внимательнее, когда приводишь код.

3. Никаких разрывов в ИЕ я не вижу.

Если вопрос еще актуален, приведи полноценный код, а не обрывки, и локализуй проблему.

VoVa · April 8, 2008

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jabra</title>
<link rel="stylesheet" type="text/css" href="css/style1.css"/>
</head>
<body>

<div id="wrap">
<!--header page-->
<div id="header">
<div id="menu1">
<ul id="menuList">
<li class="menuWrite"><a href="">Главная</a></li><img src="images/razd.gif" hspace="10" align="top" class="img" />
<li class="menuWrite"><a href="">Новости</a></li><img src="images/razd.gif" hspace="10" align="top" class="img" />
<li class="menuWrite"><a href="">Магазин</a></li><img src="images/razd.gif" hspace="10" align="top" class="img"/>
<li class="menuWrite"><a href="">Контакты</a></li><img src="images/razd.gif" hspace="10" align="top" class="img"/>
</ul>
<form action="" class="searchButton" id="search">
<input type="submit" class="searchButton"src="images/search.jpg" alt="поиск" value="Поиск"/>
<input type="text" class="searchMenu" maxlength="30" size="25" />
</form>
<img src="images/korzina.gif" align="top" id="korz"/>
</div>
</div>
<!--Menu-->
<div id="menu">
<a href=""><img src="images/leftvverh.gif" alt="1" /></a>
<a href=""><img src="images/middleverh.gif" id="second" alt="2"/></a>
<a href=""><img src="images/rightVerh.gif" id="third" alt="3"/></a>
<p class="contentWrite">Главная</p>
</div>
<!--Content-->
<div id="content">

</div>
<!--footer-->
<div id="footer">
</div>
</div>
</body>
</html>
и стили
body {
 background:url(../images/fon.gif);
 margin:0px;
 padding:0px;
}

#content{
 background-image:url(../images/cer.gif);
 background-repeat:repeat-y;
 clear:both;
 float:left;
 height:700px;
 margin:0;
 padding:0px;
 width:821px;
}

#header{
 background:url(../images/header.gif);
 clear:both;
 float:left;
 height:34px;
 padding-top:70px;
 width:821px;
 }

#footer{
 background-image:url(../images/niz.gif);
 clear:both;
 height:16px;
 float:left;
 width:821px;
} 

#korz{
 margin-left:-7px;
 vertical-align: bottom;
}

#menu{
 clear: both;
 float: left;
 margin: 0px;
 height:216px;
 padding: 0px;
 width:830px;
}

#menu1{
 height: 20px;
 padding-left: 0px;
 width:710px;
}

#menuList{
 display:inline;
 margin: 0px;
 padding: 0px 0px 0px 25px;
 }

#menu img{
 border:none;
 }

#second{
margin-left:-4px;
}

#search{
 background-image: url(../images/button.gif);
 display:inline;
 width:350px;
 }

#third{
margin-left:-4px;
}

#wrap{
 height:1000px;
 margin: 0px auto; /*задали размер сделали верхний отступ отцентровали */
 padding: 15px;
 width:830px;
 }



.contentWrite{
 color: #000000;
 font-size:12px;
 font-family: Arial, Helvetica, sans-serif;
 font-weight:bold;
 margin-top:-20px;
 margin-left:20px;
 }

.img{
 margin-top: 4px;
}

.menuWrite a{
 color: #333333;
 font-family: Arial, Helvetica, sans-serif;
 font-size:16px;
 height: 19px;
 text-decoration:none;
 vertical-align: bottom;
 }

.menuWrite{
 display: inline;
 list-style-type:none;
 }

.searchButton{
 background:transparent;
 background-image:url(../images/button.gif);
 border:none;
 color: #333333;
 font-size:16px;
 font-family: Arial, Helvetica, sans-serif;
 height:19px;
 margin-top: 2px;
 margin-left: -5px;
 vertical-align: bottom;
 }
.searchMenu{
 background:#666666;
 border: none;
 vertical-align: bottom;
 }

в ие6 между Content`ом и Menu появляется горизонтальный отступ величной 3рх ну могу картинку показать тока не знаю как тут на почту вам кину или еще что нить и если не сложно покритикуйте само написание кода что не так и где нетак(если не сложно)

Storm · April 9, 2008

Не совсем понятно, что такое "горизонтальный разрыв". Если имеется в виду то, что блоки #content и #menu разной длины, так у них разные width в стилях. Убери у #content свойство clear:both из-за него в ИЕ6 наблюдается глюк, возможно именно тот, о котором ты писал.

Sign In

ie6 замучал меня

Question

Link to comment

Share on other sites

10 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information