Как динамически менять ширину DIV?

Question

[lostinfuture]

Подскажите каким образом можно динамически поменять ширину DIV в зависимости от того сколько DIV с фиксированной шириной в него вложено? К примеру: ширина основного дива 8500 — в него вложено 10 DIVов по 800px плюс 50 на отступы. Вложенные DIVы выстраиваются горизонтально. Суть в том что бы не было лишней прокрутки к примеру когда вложенных DIV не 10 а 5

Comments

[clamaw]

Вложенные дивы генерятся джава-скриптом или с сервера отдаются?

[lostinfuture]

Пока это просто html документ со статично прописаными дивами. Из него планирую делать тему для вордпресса — соответственно дивы будут постами в блоге. Посоветуйте как грамотней поступить

Answer 1

[Blah]

Ну здесь как бы вариантов не много. Обернуть/заменить все таблицей, либо javascript-ом задавать ширину родителю. Можно еще попробовать вариант с

#parent{white-space:nowrap;}
.child{display:inline-block;}

со всеми вытекающими, но физически ваши посты не будут растягивать контейнер.
Как по мне то проще всего сделать так:

$(function(){
	var w = 0;
	$(".child").each(function(){
		w += $(this).width();
	});
	$("#parent").width(w);
});

Comments

[lostinfuture]

Интересный вариант, попробую. А про Ява код можно подробнее?

[lostinfuture]

Вариант с #parent{white-space:nowrap;}
.child{display:inline-block;} сработал! Огромное спасибо!

[Blah]

jQuery-код считающий сумму ширин постов, правда без учета margin-ов.

>«со всеми вытекающими»
Про кроссбраузерный inline-block написано много, почитайте.

[lostinfuture]

да уж радость была преждевременной. inline-block корректо работает только в chrome

[Blah]

jsfiddle.net/FCyFe
или покажите код

[lostinfuture]

lostinfuture.jino.ru

[lostinfuture]

во всех браузерах кроме хрома показывает только первый div

Answer 2

[SEObomj]

Дык автоматом же растягивается основной блок. И никакой прокрутки — тянется по ширине окна, а остальное переноситься на следующую строку.
narod.ru/disk/475247001/ololo.html.html

Comments

[lostinfuture]

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