Кратная (минимаксная) ширина div

[Arkham]

Здравствуйте, столкнулся со следующей проблемой:

Есть один div с 100% шириной, в нём много вложенных div'ов с заданной конкретной шириной - 150 px.

Проблема состоит в том, что при некоторых разрешениях экрана ширина родительского div'a становиться не кратна ширине вложенных.

Например: 1440px - в родительском div оказывается 9 вложенных div'ов и ещё где то половина пустого пространства (фона).

Как без использования js можно добиться того, что бы родительский div мог растягиваться и в нём было максимальное кол-во вложенных div'ов, но при этом он облегал вложенные div'ы по ширине (т.е. например вместо 1440 получалось 1350)?

Пробовал:

присваивать min/max-width без указанной width, а так же комбинации с auto;

делать второй div со 100% шириной, что бы тот уменьшил размер первого;

помещать родительский div в td и растягивать другой td на 100%;

Но нужного эффекта не достиг.

[Rikani]

Возможно вам стоит попробовать один из трех, пришедших мне в голову, вариантов. Прописывать для внешнего div'а.

Вариант 1: display: inline-block;

Валиант 2: float: left/right;

Вариант 3: position: absolute;

[hedgehog]

в голову пришел такой извращенный вариант http://jsfiddle.net/TnTqH/

justify можно заменить на center со всеми вытекающими

В ie6-7 работать не будет

PS: для CSS3 браузеров можно использовать Media Queries для определения поведения при конкретных размерах окна или экрана.

Edited December 8, 2011 by hedgehog

[Arkham]

Возможно вам стоит попробовать один из трех, пришедших мне в голову, вариантов. Прописывать для внешнего div'а.

Вариант 1: display: inline-block;

Валиант 2: float: left/right;

Вариант 3: position: absolute;

Не помогло.

в голову пришел такой извращенный вариант http://jsfiddle.net/TnTqH/

justify можно заменить на center со всеми вытекающими

Немного не то, суть проблемы не в расположении блоков, а в лишнем пространстве родительского div'a.

Сделал макет что бы было более понятна проблема (кликабельно):

[SelenIT]

Боюсь, для современных браузеров — только менять ширину контейнера для разных диапазонов ширины окна через media queries. Рецепты Rikani не работают начиная уже с IE8 и FF3.

[SelenIT]

На Хабре опубликовали еще один забавный вариант решения. К сожалению, в половине современных браузеров не фурычит (и, видимо, не будет). Но в комментах есть несколько альтернативных идей для частных случаев.