Помогите. Слой не тянется в ИЕ6 по высоте.

bmv · May 12, 2008

Проблема в том что в ИЕ6 если жестко не пропишешь высоту блока в px то вложенный слой "height: 100%" тянуться не хочет. А в FF, Opere, Safari (в других не смотрел) все ок.

Я делаю рамку для дивного блока, следующим образом: (страничку можно посмотреть по адресу: http://www.sevstar.net/downloads/project/music.sevstar.net/)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta http-equiv="content-language" content="ru" />
<meta name="robots" content="index, follow" />
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<style>
.section {
 position: relative;
 background: url(_/bg-section.jpg) bottom repeat-x white;
}

.header-text {
 margin: 15px;
}

.corner1 {
 position: absolute;
 top: 0px;
 right: 0px;
 width: 4px;
 height: 4px;
 z-index: 8;
 background: url(_/corner-1.png) no-repeat;
}

.corner2 {
 position: absolute;
 bottom: 0px;
 right: 0px;
 width: 4px;
 height: 4px;
 z-index: 7;
 background: url(_/corner-2.png) no-repeat bottom;
}

.corner3 {
 position: absolute;
 bottom: 0px;
 left: 0px;
 width: 4px;
 height: 4px;
 z-index: 6;
 background: url(_/corner-3.png) no-repeat bottom;
}

.corner4 {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 4px;
 height: 4px;
 z-index: 5;
 background: url(_/corner-4.png) no-repeat;
}

.corner5 {
 position: absolute;
 bottom: 0px;
 right: 0px;
 width: 4px;
 height: 4px;
 z-index: 5;
 font-size: 1px;
 background: url(_/corner-5a.png) no-repeat;
}

.corner6 {
 position: absolute;
 bottom: 0px;
 left: 0px;
 width: 4px;
 height: 4px;
 z-index: 5;
 font-size: 1px;
 background: url(_/corner-6a.png) no-repeat;
}

.border-top {
 position: absolute;
 top: 0px;
 width: 100%;
 height: 4px;
 z-index: 4;
 background: url(_/border-top.png) repeat-x;
}

.border-right {
 position: absolute;
 top: 0px;
 right: 0px;
 width: 4px;
 height: 100%;
 z-index: 4;
 background: url(_/border-right.png) repeat-y;
}

.border-bottom {
 position: absolute;
 bottom: 0px;
 width: 100%;
 height: 4px;
 z-index: 4;
 background: url(_/border-bottom.png) repeat-x bottom;
}

.border-left {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 4px;
 height: 100%;
 z-index: 4;
 background: url(_/border-left.png) repeat-y;
}
</style>
</head>

<body>

 <div class="section" style="margin-top:35px; height:100%;">

 <div class="header-text">
 border-right и border-left не тянутся в ИЕ6 по высоте

 border-right и border-left не тянутся в ИЕ6 по высоте

 border-right и border-left не тянутся в ИЕ6 по высоте

 border-right и border-left не тянутся в ИЕ6 по высоте
 </div>

 <!--Borders and corners-->
 <div class="corner1"></div>
 <div class="corner2"></div>
 <div class="corner3"></div>
 <div class="corner4"></div>

 <div class="border-top"></div>
 <div class="border-right"></div>
 <div class="border-bottom"></div>
 <div class="border-left"></div>
 <!--End borders and corners-->
 </div>

</body>

</html>

Есть предположение что это DTD балуется, над ИЕ или наоборот... Дело в том что блок будет неизвестно какой высоты он должен тянуться.

Sotnikov · May 13, 2008

Посмотри, как это работает, возможно поможет

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>:)</title>
<style type="text/css">
<!--
* {
 padding: 0;
 margin: 0;
}
html, body {
 height: 100%;
}
body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 0.8em;
}
#container {
 width: 500px;
 background-color: #F2F2F2;
 text-align: center;
 min-height: 100%;
}
* html #container {
 height: 100%;
}
-->
</style>
</head>

<body>
<div id="container">
 <p>Ну вроде как меняет выстраивает высоту и в IE6!</p>
</div>
</body>
</html>

Sotnikov · May 15, 2008

а кстати, кто-нибудь еще сталкивался с этой проблемой?

Dimitry Wolotko · May 15, 2008

mmm Проблемы с версткой

Sign In

Помогите. Слой не тянется в ИЕ6 по высоте.

Question

bmv

Link to comment

Share on other sites

3 answers to this question

Recommended Posts

Sotnikov

Link to comment

Share on other sites

Sotnikov

Link to comment

Share on other sites

Dimitry Wolotko

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information