Верстка div'ом в 2 столбца

rolph · July 2, 2009

Подскажите, пожалуйста,

есть div, который выводится динамически, т.е. блок с инфой размером 250px; родительский div - 500px.

надо выводить по 2 столбца.

Сейчас выводит всё в 1 столбец.

#single_block {
	clear: left;
	margin: 15px 10px;
	width: 250px;
}

#single_block img {
	float: left;
	margin: 0 7px 7px 0;
}

rolph · July 2, 2009

Немного помогло (кроме IE 6 и 7)

#single_block {
	clear: left;
	margin: 15px 10px;
	width: 250px;
display: inline-block;
}

#single_block img {
	float: left;
	margin: 0 7px 7px 0;
}

Edited July 2, 2009 by rolph

Zippovich · July 2, 2009

у Вас внутренние блоки не вмещаются во внешний, исходя их css размер 2-х внутренних блоков занимает 540px

rolph · July 2, 2009

у Вас внутренние блоки не вмещаются во внешний, исходя их css размер 2-х внутренних блоков занимает 540px

Внешний div

#rightcolumn { 
 float: right;
 color: #333;
 margin: 0px 0px 5px 0px;
 padding: 10px;
 width: 678px;
 display: inline;
}

Zippovich · July 2, 2009

#single_block {
	clear: left;
	margin: 15px 10px;
	width: 250px;
	float: left
}

rolph · July 2, 2009

#single_block {
	clear: left;
	margin: 15px 10px;
	width: 250px;
	float: left
}

Теперь в мозилле не отображается )

Zippovich · July 2, 2009

добавьте еще сюда display: inline-block

для ie6 переопределите на display: inline

и clear: left уберите

Edited July 2, 2009 by Zippovich

rolph · July 2, 2009

добавьте еще сюда display: inline-block
для ie6 переопределите на display: inline
и clear: left уберите

Сделал

#single_block {
	margin: 15px 10px;
	width: 250px;
	float: left;
display: inline-block;
}

а для IE6 в <head>

<!--[if lte IE 6]>

#single_block {

margin: 15px 10px;

width: 250px;

float: left;

display: inline;

}

</style>

<![endif]-->

Отражается вроде нормально, но в первом столбце иногда пропускает место. _ttp://www.devilbiss.ru/index.php?id=11

Edited July 3, 2009 by rolph

rolph · July 3, 2009

Может быть, эту задачу, вообще, реализовать через ul + css?

Sign In

Верстка div'ом в 2 столбца

Question

rolph

Link to comment

Share on other sites

8 answers to this question

Recommended Posts

rolph

Link to comment

Share on other sites

Zippovich

Link to comment

Share on other sites

rolph

Link to comment

Share on other sites

Zippovich

Link to comment

Share on other sites

rolph

Link to comment

Share on other sites

Zippovich

Link to comment

Share on other sites

rolph

Link to comment

Share on other sites

rolph

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information