LINUX.ORG.RU

А есть ли какая-нибудь магия для оптимального заполнения страницы плавающими блоками?

 , , ,


2

2

Причём таких разноразмерных блоков может быть произвольное количество и у них могут быть произвольные размеры в произвольном порядке.

Пример: http://jsfiddle.net/Bad_ptr/yw9aM/2/
Тут видно, что #b4 и #b5 могли бы разместиться слева под #b1.

Есть что-нибудь для таких случаев в современном html/css или это придётся вычислять скриптами?

★★★★★

для списков блоков стало модно использовать li-подобную разметку

Управление оптимальным размещением можно делать через display в перемешку c text-align у блоков/контейнера и другими align-свойствами, и некоторые свойства доступные через префикс вендора типа -moz но с оговорками... Сейчас не вспомню, но в firebug можно посмотреть какие свойства доступны в браузере для display, text-align

Для вдохновения:

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexible_boxes

https://developer.mozilla.org/en-US/docs/Web/CSS/display

swwwfactory ★★
()

Ясненько), значит скриптами.

Bad_ptr ★★★★★
() автор топика

У тебя ширина одинаковая? Посмотри в прикреплённом топике про библиотеки, я там что-то похожее спрашивал, в конце потом взял какое-то простое решение.

Kalashnikov ★★★
()

А вот можно ли сделать у двух из пяти столбцов таблицы одинаковую ширину (+/- 1px), максимально возможную? width: 50% не совсем помогает, граница плавает туда-сюда до десятка пикселов в зависимости от текста внутри ячеек.

anonymous
()
Ответ на: комментарий от anonymous

table.ololo { table-layout: fixed; border-collapse: collapse; } например.

Даст всем равную ширину. Вкладывай таблицы или остальным столбцам ширину указывай.

anonymous
()
Ответ на: комментарий от Kalashnikov

Да, нашёл, 'многоколоночный список', интересная штука.
http://jsfiddle.net/Bad_ptr/yw9aM/4/
Ещё б оно автоматически число столбцов подгоняло в зависимости от ширины страницы — вообще б нормально было бы.

Bad_ptr ★★★★★
() автор топика
Ответ на: комментарий от Bad_ptr

Он интересный, но иногда странный. Пробовал где-то полгода назад, штука была с причудами (хотя потенциально она очень нужна).

AlexKiriukha ★★★★
()
Ответ на: комментарий от AlexKiriukha

Ага, вот сейчас нормально срабатывает только после ресайза окна.

Bad_ptr ★★★★★
() автор топика
Ответ на: комментарий от Bad_ptr

Я вообще имел в виду ul/ol/dl с li, на остальном оно по-другому кажется работает.

И свойства без префиксов нужно последними указывать.

Посмотри ещё flexbox - достаточно мощно и упорото.

Kalashnikov ★★★
()
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.