Бывает, возникает вопрос (по «вине» дизайнеров или заказчиков), что картинки надо расположить по ?ирине страницы (ну или родительского контейнера) равномерно, то есть первая (для читающих слева направо) картинка должна быть выровнена по левому краю, последняя – по правому, а остальные – находится друг от друга и от крайних на одинаковом расстоянии. Вот как-то так:
Самый простой вариант, который я сам использую – это использовать таблицу. Это, так скажем, не самое правильное использование таблицы, но зато самое простое и наименее времезатратное, что бывает важно.
Создадим табличку на пять ячеек и в каждую поместим по картинке. Выровняем картинки по центру ячеек (td {text-align: center}), а таблицу растянем на всю ?ирину (table {width: 100%})
Сейчас между картинками одинаковое расстояние, что и требуется. ? это нам необходимо сохранить. ? при этом крайние картинки должны быть прижаты к краям. Для этого добавим в таблицу пустые ячейки между ячейками, в которых находятся картинки.
Как и следовало ожидать, и как и должно было произойти (такова природа таблиц: для ячеек, содержащих боль?е отводится боль?ее место), пустые ячейки сжались до минимальной ?ирины. Поэтому для ячеек с картинками создадим класс, которому зададим свойство width:1%. Опять воспользуемся свойством таблиц: несмотря на указание ?ирины ячейкам, эти ячейки будут растянуты по ?ирине содержимого, если только таблице на задано свойство table-layout:fixed.
Вот мы и получили, что требовалось. Уберем границы у ячеек, которые были добавлены для наглядности, и можно использовать. Но, конечно, надо подумать, как избавиться от таблицы при верстке подобной задачи.
