Не рабоотает padding-bottom при float-left для вложенных дивов. Почему?

Semreg · September 22, 2009

Пример кода как нужно:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<style type="text/css">

.d1 {
  width: 500px;
  border: 1px solid #424142;
}

.d2 {
  padding: 10px;
}

.d3 {
  width: 100px;
  background: #999999;
}

.d4 {
  float:left;
  width: 100px;
  background: #555555;
}

</style>

</head>

<body>

<div class="d1">
  <div class="d2">
	<div class="d3">
	  Блок 1
	</div>
  </div>
</div>

</body>
</html>

Только внутри мне нужно вложить 3-и прифлоатенных блока. Вкладываю - пропадает паддинг снизу:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<style type="text/css">

.d1 {
  width: 500px;
  border: 1px solid #424142;
}

.d2 {
  padding: 10px;
}

.d3 {
  float:left;
  width: 100px;
  background: #999999;
}

.d4 {
  float:left;
  width: 100px;
  background: #555555;
}

</style>

</head>

<body>

<div class="d1">
  <div class="d2">
	<div class="d3">
	  Блок 1
	</div>
	<div class="d4">
	  Блок 2
	</div>
	<div class="d3">
	  Блок 3
	</div>
  </div>
</div>

</body>
</html>

Как лечить? :blink:

psywalker · September 22, 2009

лови :blink:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<style type="text/css">

.d1 {
  width: 500px;
  border: 1px solid #424142;
  overflow: hidden;
}

.d2 {
  padding: 10px;
  overflow: hidden;
}

.d3 {
  float:left;
  width: 100px;
  background: #999999;
}

.d4 {
  float:left;
  width: 100px;
  background: #555555;
}

</style>

</head>

<body>

<div class="d1">
  <div class="d2">
	<div class="d3">
	  Блок 1
	</div>
	<div class="d4">
	  Блок 2
	</div>
	<div class="d3">
	  Блок 3
	</div>
  </div>
</div>

</body>
</html>

Semreg · September 22, 2009

А де zoom:1, бракодел!? :blink:

Уже успел прочитать твою соседнюю тему

psywalker · September 22, 2009

А де zoom:1, бракодел!?
Уже успел прочитать твою соседнюю тему

:blink:

Sign In

Не рабоотает padding-bottom при float-left для вложенных дивов. Почему?

Question

Semreg

Link to comment

Share on other sites

3 answers to this question

Recommended Posts

psywalker

Link to comment

Share on other sites

Semreg

Link to comment

Share on other sites

psywalker

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information