Описание
Задает расстояние между границами ячеек в таблице. border-spacing не работает в случае, когда для таблицы установлено свойство border-collapse со значением collapse.
Синтаксис
border-spacing: значение1 [значение2]
Значения
Одно значение устанавливает одновременно расстояние по вертикали и горизонтали между границами ячеек. Если значений два, то первое определяет горизонтальное расстояние, а второе — вертикальное.
Добавлено через 01:25 сек.
В общем работает как неповоротливое margin
Добавлено через 06:12 сек.
Display: table-cell
На мой взгляд, самое интересное из табличных значений display. Означает: «Веди себя как ячейка таблицы». По умолчанию это значение имеют элементы td и th. Свойства табличных ячеек и элементов со значением display: table-cell:
идущие подряд ячейки находятся на одной строке с себе подобными, не переходя на следующую; если ячейкам на строке тесно, они сначала ужимаются по ширине, а затем начинают распяливать контейнер и/или окно браузера;
ширина ячеек по умолчанию распределяется пропорционально содержанию (с учётом всех ячеек в данной строке), однако может прямо задаваться через css;
все ячейки в строке имеют одинаковую высоту, которая определяется содержанием самой большой ячейки в данной строке;
ячейка может иметь внутренние отступы (padding), но не может иметь полей (margin);
к табличным ячейкам применимо вертикальное выравнивание по табличному принципу: свойство vertical-align выравнивает содержание ячейки по высоте относительно самой ячейки, при этом ячейки в строке сохраняют одинаковую высоту, в отличие от строчных или строчно-блочных элементов. Значения vertical-align не бывают отрицательными;
содержание ячейки может выравниваться по горизонтали (text-align);
у ячейки может быть рамка, но чтобы повлиять на слияние/расклеивание рамок, надо соответствующие свойства назначать контейнеру, а не текущему элементу; кстати, в старых версиях Оперы у элементов со значением table-cell значение border-spacing почему-то было ненулевым и создавало лишние зазоры, в силу чего таким элементам требовалось правило border-collapse: collapse; сейчас этого, вроде бы, не наблюдается.
Интересно, что если родительский элемент со свойством display: table или table-row наряду с потомками типа table-cell содержит элементы с другими типами отображения, то группа не табличных элементов образует ещё одну ячейку в той же строке, в противном случае строка разрывается.
Далее идут совсем уж малоупотребительные типы отображения; по мере того, как будет уходить IE7, можно будет уделить им больше внимания, а пока достаточно краткого перечисления.
Изменил: Лёха (11.03.2013 / 10:22)
