Как поставить в ряд 2 div'а внутри контейнера?

[localhot]

Нужно, чтобы в контейнере (#box) два дива стали в ряд.

При данном HTML они в ряд располагаются, но вылезают из #box внизу при увеличении текста в дивах.

Если в #box добавить свойство float:left; по идее, это позволит #box растягиваться, чтобы включать в себя дивы любой высоты, но тогда #box из центра слетит влево..

Что можно сделать?

<style>

#box{
	width:900px;
	margin:50px auto 40px auto;
	padding-bottom:30px;
	min-height:350px;
}

</style>

<div id='box' style="width:980px; min-height:450px;">

<div id='1' style='float:left; margin-left:40px;'>
   Текст 1
</div>


<div id='2' style='float:left; margin-left:90px;'>
   Текст 2
</div>

</div><!--/box-->

1 класс, вторая четверть.. (

 

[lekzd]

после div с float:left поставить <br clear="all"/> перед закрывающим тегом родительского блока

 

[localhot]

ЙЕСС, сработало!
Просто, гениально и молниеносно! Спасибо!!

 

[tigra60]

Есть более джедайский способ (без лишних блоков, рубящих семантику):

#box:after{
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility:hidden;
}
/* for IE6 */
*html#box {height:1%;}
/* for IE7 */
*:first-child+html#box {min-height:1px;}

 

[Volter9]

Ребята, а про

display:block-inline

не забыли)

 

[lekzd]

Ребята, а про display:block-inline не забыли)

IE<9 не знают этот метод

тогда уже надо и про display: table-cell вспомнить

 

[Volter9]

Ребята, а про display:block-inline не забыли)

IE<9 не знают этот метод

тогда уже надо и про display: table-cell вспомнить

Ну так уж совсем перейдем на таблицы Меньше маразма с дивами, когда начинал делать сайты, у меня были проблемы позиционированием.

А также можно вообще статические попробывать проблему решить

top: 10;
 left:10;
 width:100;
 height: possition:absolute;

 

[lekzd]

top: 10; left:10; width:100; height: possition:absolute;

что это за ужас?

 

[veryaskinan]

после div с float:left поставить <br clear="all"/> перед закрывающим тегом родительского блока

Хороший прием ) сам его только недавно обнаружил ) теперь каждый раз пользуюсь ) А раньше голову ломал почему если у блоков флоат поставлен то содержимое наружу лезет =) Я был поражен когда открыл такое простое решение )

 

[Volter9]

top: 10; left:10; width:100; height: possition:absolute;

что это за ужас?

Знаю. Многие говорят что position: absolute не всегда работает идиально.
Я просто показал пример позиционирование дивов

 

[lekzd]

Знаю. Многие говорят что position: absolute не всегда работает идиально.

они просто не знают как им пользоваться

Я просто показал пример позиционирование дивов

больше никогда не пишите так неграмотно на CSS