Нету высоты во вложенном div-е

DmitriyK · May 22, 2010

html файл

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="css/css.css" rel="stylesheet" type="text/css" />
<script src="js/minmax.js" type="text/JavaScript"></script>
</head>

<body>
<div id="header">Заголовок</span></div>
<div id="content">
	<div id="outer1">
	  <div id="outer2">
		 <div id="l_back"><div><div> </div></div></div>
		 <div id="r_back"><div><div></div></div></div>
	  </div>
	</div>
	<div id="main">
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Конте3333333нт<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент444444444<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент<br/>
		Контент5555555555<br/>
	</div>
</div>

<div id="footer">Футер</div>
</body>
</html>

css файл

@charset "utf-8";
/* CSS Document */
* {margin: 0px; padding: 0px;}
html {background: #F0F3F0; height: 100%;}
body {min-width: 982px; min-height: 100%; position: relative;}
html body {height: 100%;}

#header {
height: 34px; 
background-image:url(../images/top_back.jpg);
background-position:center top;
background-repeat:no-repeat;
}
#content {
width: 100%;
height:100%; /*padding-bottom: 134px;*/ 
overflow: hidden;
/**/
}

#outer1 {width: 100%;
/**/
height:100%; 
margin-left: -100%; 
float:right;
}
#outer2 {
margin-left:980px;
background-color:#00FF99;
height:100%;}

#l_back {width: 50%;
height:100%;
/*min-height:1250px;*/
float: left;
position: relative; 
left: -980px;
background-image:url(../images/left_bgr.jpg);
background-position:right top;
background-repeat:repeat-y;}
}
div#l_back div{
height:100%;
/*min-height:1250px;*/
background-image:url(../images/index_04.jpg);
background-position:right top;
background-repeat:no-repeat;
}
div#l_back div div{
height:100%;
/*min-height:1250px;*/
background-image:url(../images/index_12.jpg);
background-position:right bottom;
background-repeat:no-repeat;
}
#r_back {width: 50%; 
height:100%;
/*min-height:1250px;*/
margin-left: -1px; 
float: right;
background-image:url(../images/rightbgr.jpg);
background-position:left top;
background-repeat:repeat-y;
}
div#r_back div{
height:100%;
/*min-height:1250px;*/
background-image:url(../images/index_06.jpg);
background-position:left top;
background-repeat:no-repeat;
}
div#r_back div div{
height:100%;
/*min-height:1250px;*/
background-image:url(../images/index_13.jpg);
background-position:left bottom;
background-repeat:no-repeat;
}
#main {width: 980px;height:100%;margin: 0px auto;background-color:#99FF99;}
#footer {background: #F0F3F0; 
background-image:url(../images/index_14.jpg);
background-position:center top;
background-repeat:no-repeat;
width: 100%; 
height: 134px; 
position:absolute; 
/*bottom:0px;*/}
* html #footer {bottom: -1px;}

Это треколоночный макет с резиновым левым и правым боком, центральный - фиксированный.

Суть вот в чем)

- не применяется стиль для второго блоа div

он не расстягивается на высоту в 100%

хотя его родитель <div id="l_back"> имеет 100% высоту

с правой колонкой таких проблем нет ) и вытягивается на 100% высоту

оба они находятся в одом блоке.

Помогите растянуть на 100% левый блок =)

(p.s. к вложенный в него же див применятся стиль, а к тому, что есть родитель - нет, только общий - margin 0 и padding 0 )

psywalker · May 22, 2010

Покажи скриншот того, что хочешь получить. С подробным объяснением и указателями.

DmitriyK · May 22, 2010

Edited May 22, 2010 by DmitriyK

psywalker · May 22, 2010

Ты покажи скриншот того, ЧТО ХОЧЕШЬ получить. Что в итоге должно быть?

Searcher · May 24, 2010

Так на глаз не вижу проблем. Со свойствами бэкграунда ничего не напутано (с position и repeat)? А как в других броузерах?

Лучше выложите на каком-нибудь бесплатном хостинге ваш сайт, а то геморно себе копировать, а потом еще без картинок пытаться понять, что там у вас и где...

background все-же лучше записывать сокращенно: background-image:url(../images/index_14.jpg) center top no-repeat;

Sign In

Нету высоты во вложенном div-е

Question

DmitriyK

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

psywalker

Link to comment

Share on other sites

DmitriyK

Link to comment

Share on other sites

psywalker

Link to comment

Share on other sites

Searcher

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information