Почему теряется высота дива при установке дочерним жлементам свойства float

[proflead]

Всем привет

Еще один вопрос и одна проблема, есть код:

<div>

<p><img src="img" alt="" title="" width="300" height="200"></p>

<div>

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

При таком состоянии, высота дива, зависит от его элементов, которые находятся внутри, она равна примерно 200px, если мы сделаем так:

<div>

<p style="float: left"><img src="img" alt="" title="" width="300" height="200"></p>

<div style="float: right">

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

Родительский Div потеряет свою высоту.

Как сделать так, чтобы высота div все так же зависила от элементов внутри него? (прописат height: XXXpx, не подходит, так как блок не извсетной высоты)

Спасибо.

[Softlink]

Всем привет

Еще один вопрос и одна проблема, есть код:

<div>

<p><img src="img" alt="" title="" width="300" height="200"></p>

<div>

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

При таком состоянии, высота дива, зависит от его элементов, которые находятся внутри, она равна примерно 200px, если мы сделаем так:

<div>

<p style="float: left"><img src="img" alt="" title="" width="300" height="200"></p>

<div style="float: right">

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

Родительский Div потеряет свою высоту.

Как сделать так, чтобы высота div все так же зависила от элементов внутри него? (прописат height: XXXpx, не подходит, так как блок не извсетной высоты)

Спасибо.

задайте родителю overflow:hidden;

[proflead]

Всем привет

Еще один вопрос и одна проблема, есть код:

<div>

<p><img src="img" alt="" title="" width="300" height="200"></p>

<div>

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

При таком состоянии, высота дива, зависит от его элементов, которые находятся внутри, она равна примерно 200px, если мы сделаем так:

<div>

<p style="float: left"><img src="img" alt="" title="" width="300" height="200"></p>

<div style="float: right">

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

Родительский Div потеряет свою высоту.

Как сделать так, чтобы высота div все так же зависила от элементов внутри него? (прописат height: XXXpx, не подходит, так как блок не извсетной высоты)

Спасибо.

задайте родителю overflow:hidden;

Спасибо, а почему это помогло?

[Myuzik]

или флоат

[proflead]

Всем привет

Еще один вопрос и одна проблема, есть код:

<div>

<p><img src="img" alt="" title="" width="300" height="200"></p>

<div>

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

При таком состоянии, высота дива, зависит от его элементов, которые находятся внутри, она равна примерно 200px, если мы сделаем так:

<div>

<p style="float: left"><img src="img" alt="" title="" width="300" height="200"></p>

<div style="float: right">

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

Родительский Div потеряет свою высоту.

Как сделать так, чтобы высота div все так же зависила от элементов внутри него? (прописат height: XXXpx, не подходит, так как блок не извсетной высоты)

Спасибо.

задайте родителю overflow:hidden;

Спасибо, а почему это помогло?

В IE6 не помогло

или флоат

Если поставить float, то блок сместиться, а мне не нужно чтобы он двигался, сместиться на расстояние padding-ов этого div, для которого я поставил float

Всем привет

Еще один вопрос и одна проблема, есть код:

<div>

<p><img src="img" alt="" title="" width="300" height="200"></p>

<div>

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

При таком состоянии, высота дива, зависит от его элементов, которые находятся внутри, она равна примерно 200px, если мы сделаем так:

<div>

<p style="float: left"><img src="img" alt="" title="" width="300" height="200"></p>

<div style="float: right">

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

Родительский Div потеряет свою высоту.

Как сделать так, чтобы высота div все так же зависила от элементов внутри него? (прописат height: XXXpx, не подходит, так как блок не извсетной высоты)

Спасибо.

задайте родителю overflow:hidden;

Спасибо, а почему это помогло?

В IE6 не помогло

или флоат

Если поставить float, то блок сместиться, а мне не нужно чтобы он двигался, сместиться на расстояние padding-ов этого div, для которого я поставил float

пример:

<div style="padding: 0 20px; float: right">

<p style="float: left"><img src="img" alt="" title="" width="300" height="200"></p>

<div style="float: right">

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

Смещается на 20 пикселей.

Всем привет

Еще один вопрос и одна проблема, есть код:

<div>

<p><img src="img" alt="" title="" width="300" height="200"></p>

<div>

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

При таком состоянии, высота дива, зависит от его элементов, которые находятся внутри, она равна примерно 200px, если мы сделаем так:

<div>

<p style="float: left"><img src="img" alt="" title="" width="300" height="200"></p>

<div style="float: right">

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

Родительский Div потеряет свою высоту.

Как сделать так, чтобы высота div все так же зависила от элементов внутри него? (прописат height: XXXpx, не подходит, так как блок не извсетной высоты)

Спасибо.

задайте родителю overflow:hidden;

Спасибо, а почему это помогло?

В IE6 не помогло

или флоат

Если поставить float, то блок сместиться, а мне не нужно чтобы он двигался, сместиться на расстояние padding-ов этого div, для которого я поставил float

Всем привет

Еще один вопрос и одна проблема, есть код:

<div>

<p><img src="img" alt="" title="" width="300" height="200"></p>

<div>

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

При таком состоянии, высота дива, зависит от его элементов, которые находятся внутри, она равна примерно 200px, если мы сделаем так:

<div>

<p style="float: left"><img src="img" alt="" title="" width="300" height="200"></p>

<div style="float: right">

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

Родительский Div потеряет свою высоту.

Как сделать так, чтобы высота div все так же зависила от элементов внутри него? (прописат height: XXXpx, не подходит, так как блок не извсетной высоты)

Спасибо.

задайте родителю overflow:hidden;

Спасибо, а почему это помогло?

В IE6 не помогло

или флоат

Если поставить float, то блок сместиться, а мне не нужно чтобы он двигался, сместиться на расстояние padding-ов этого div, для которого я поставил float

пример:

<div style="padding: 0 20px; float: right">

<p style="float: left"><img src="img" alt="" title="" width="300" height="200"></p>

<div style="float: right">

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

Смещается на 20 пикселей.

Вот так работет везде:

<div style="padding: 0 20px; overflow: hidden; zoom 1">

<p style="float: left"><img src="img" alt="" title="" width="300" height="200"></p>

<div style="float: right">

<h1>Текст</h1>

<p>Много текста</p>

</div>

</div>

Edited September 17, 2011 by proflead