.jpg)
Добрый день! Сегодня хотел бы поговорить о реализации равноудаленных элементов с помощью css. Часто на блогах вижу горизонтальную полоску, в которой размещаются равноудалено блоки. Обычно – анонсы на предыдущим статьи или маленькая реклама. Для начала давайте разместим равноудалено 4 картинки. Для начала создадим блок, в который поместим 4 картинки, я размещу одинаковые картинки. !> В данном случае мы создали контейнер, и пропишем css стили для данного блока #main{ text-align:justify} #main span{ display:inline-block; width:100%; } С изображениями получилось) Давайте разберемся в коде. Зачем, тут span”- спросите Вы. Мой ответ – “Получается span “ложится” под картинками и благодаря этому картинки не разваливаются”. Теперь давайте разберемся, как можно сделать 4 равноудаленных блока. Как всегда, для начала создадим контейнер, в который вложим 4 блока.
Блок 1 Блок 2 Блок 3 Блок 4 !> Думаю, тут сложного ничего нету. Теперь пропишем css свойства #container { text-align: justify; text-justify:newspaper; width:100% } #include{ display:-moz-inline-box; display:inline-block; vertical-align:top; text-align:left; width:100px; height:100px; background:black; } #text{display:-moz-inline-box; display:inline-block; width:100%; } Всё хорошо отображается, можно изменить количество блоков. В данной статье, я вам показал как сделать равноудаленные элементы, используя css стили. Надеюсь, статья была полезная. С уважением, cava!