Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   Блочная таблица (https://javascript.ru/forum/xhtml-html-css/24490-blochnaya-tablica.html)

daMage 02.01.2012 17:27

Блочная таблица
 
Подскажите как реализовать вот такую вот таблицу при помощи дивов и css:
http://s017.radikal.ru/i422/1201/f8/c50292e905a6.jpg
Сначала я применил float: left и border.
Минусы:
Все дивы выпали из потока(еще одного дива, в котором они находились), это не желательно. Также на некоторых местах было видно сразу две линии, то есть линия справа 1-го дива и линия слева 2-го дива не соединялись. Благо здесь помог отрицательный margin.
Далее я попробовал display: inline-block и тот же бордер.
Минусы:
По непонятной мне причине(видимо плохо знаком со свойствами) после каждого блока был небольшой отступ (~5px), проблема решилась, когда каждый див находился на одной строчке, что то же не подходит. И получил тот же результат.
Но убрать нижнюю линюю для последнего ряда дивов я так и не смог, что то в голову ничего не лезит. Помогите, плз.
Спасибо.

Octane 02.01.2012 17:43

Если IE7 не нужен, то display:table и т.д. http://htmlbook.ru/css/display

daMage 02.01.2012 17:54

table - все дивы пошли в ряд
inline-table - тоже самое, что и inline-block, то есть отступы.

И что за отступы после каждого дива при display: inline-block? Их можно как то убрать?

Aetae 02.01.2012 23:23

Это пробелы.

daMage 03.01.2012 01:47

Спасибо, что разьяснили, но уже пошёл немного иным путем.
Когда я задаю футеру clear: both, то предыдущая проблема отпадает, но почему-то когда ставлю отрицательный margin для футера, то он не двигается. Так и должно быть или это у меня проблемы с версткой? Собственно вопрос, как поднять футер на 1 пиксель вверх?

Aetae 03.01.2012 01:56

А ответ то один: верстайте таблицы таблицами.


Часовой пояс GMT +3, время: 12:40.