Div Content

R

ReXTaN

Registered
Здравейте,
Как мога да направя един div, в който да има други div-ове.
Смисъл искам като задам height: auto на главния див да се увеличава автоматично по съдържанието в главния див?

Накратко искам главния ми див да се оразмерява според съдържанието в него (в който има още два дива).

Благодаря предварително :)
 
ReXTaN каза:
Здравейте,
Как мога да направя един div, в който да има други div-ове.
Смисъл искам като задам height: auto на главния див да се увеличава автоматично по съдържанието в главния див?

Накратко искам главния ми див да се оразмерява според съдържанието в него (в който има още два дива).

Благодаря предварително :)
Увеличете...
Може и да греша, но нали когато height не е фиксиран си е auto :? Пак казвам, може и да бъркам..
 
Да но като задам да е auto, background в главния див не се раширява а когато му задам определена височина на главния див се раширява.
 
@DeathGuard_ e прав ,че по подразбиране height е auto, тай че можеш да не го задава и главния ти див ще се разпъва според съдържанието , но пак трябва да имаш вече width. Не ти се разпъва бекраунда, защото мисля , тъй като не ти знам точно кода, че имаш вътре флоатнати елементи(float:left;)

сложи това: <div style="clear:both;"></div> преди затварящия таг(</div>) на главния див, да видиш дали ще се види бекграунда.

!! Когато имаш два елемента, два дива(примерно) и си ги флоатнал, задал си им float:left; то главния див не се разпъва, защото трябва този флоатинг да се изчисти, както съм ти показал по-горе.
 
shterev каза:
@DeathGuard_ e прав ,че по подразбиране height е auto, тай че можеш да не го задава и главния ти див ще се разпъва според съдържанието , но пак трябва да имаш вече width. Не ти се разпъва бекраунда, защото мисля , тъй като не ти знам точно кода, че имаш вътре флоатнати елементи(float:left;)

сложи това: <div style="clear:both;"></div> преди затварящия таг(</div>) на главния див, да видиш дали ще се види бекграунда.

!! Когато имаш два елемента, два дива(примерно) и си ги флоатнал, задал си им float:left; то главния див не се разпъва, защото трябва този флоатинг да се изчисти, както съм ти показал по-горе.
Увеличете...

Пробвах това което ми каза но нещо не се получава ето HTML/CSS кода:


CSS:
Код: 
div#content {
	width:793px; height:auto;
	background-image: url("img/menu_back2.png");
	background-repeat: repeat-y;
	padding: 10px; clear: both;
}

div.left {
	width:211px; height:auto;
	float:left;
	padding:5px;
}

div.name_l {
	width:211px; height:41px;
	background-image: url("img/menu.jpg");
	background-repeat: no-repeat;
}

div.name_r {
	width:529px; height:41px;
	background-image: url("img/snimki.jpg");
	background-repeat: no-repeat;
}

div.box {
	width:auto; height:auto;
	border-right:1px solid #b97236; border-top:0px;
	margin-bottom:10px; padding:4px;
}

div.box_r {
	width:auto; height:auto;
	margin-bottom:10px; padding:4px;
}

div.center{
	width:529px; height:auto;
	float:left;
	padding:5px;
}

HTML:
Код: 
<!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>UNIKAT-2005 Мебели</title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
=<div id="All">
<div class="logo"></div>
<div class="header"></div>
		
<div id="content" style="clear:both;">
<div class="menu">
<a href="#" title="#" target="_self">Home</a>
<a href="#" title="#" target="_self">Home</a>
<a href="#" title="#" target="_self">Home</a>
</div>
		
<div class="left">
<div class="name_l"></div>
<div class="box">
<ul>
	<li><a href="#" title="#">Начало</a></li>
	<li><a href="#" title="#">Начало</a></li>
	<li><a href="#" title="#">Начало</a></li>
	<li><a href="#" title="#">Начало</a></li>
	<li><a href="#" title="#">Начало</a></li>
	<li><a href="#" title="#">Начало</a></li>
</ul>
</div>
</div>
		
<div class="center">
<div class="name_r"></div>
<div class="box_r">
golqm content <br style="margin-bottom:50px;" />
</div>
</div>
</div>
<div class="footer">Всички права запазени - 2009 :)</div>
</div>
</body>
</html>
 
<!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>UNIKAT-2005 Мебели</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
=<div id="All">
<div class="logo"></div>
<div class="header"></div>

<div id="content" style="clear:both;">
<div class="menu">
<a href="#" title="#" target="_self">Home</a>
<a href="#" title="#" target="_self">Home</a>
<a href="#" title="#" target="_self">Home</a>
</div>

<div class="left">
<div class="name_l"></div>
<div class="box">
<ul>
<li><a href="#" title="#">Начало</a></li>
<li><a href="#" title="#">Начало</a></li>
<li><a href="#" title="#">Начало</a></li>
<li><a href="#" title="#">Начало</a></li>
<li><a href="#" title="#">Начало</a></li>
<li><a href="#" title="#">Начало</a></li>
</ul>
</div>
</div>

<div class="center">
<div class="name_r"></div>
<div class="box_r">
golqm content <br style="margin-bottom:50px;" />
</div>
</div>

<div style="clear:both;"></div>
</div>
<div class="footer">Всички права запазени - 2009 :)</div>
</div>
</body>
</html>
Увеличете...
 
Трябва да си влезнал или регистриран, за да отговориш тук.

Горе