Понимание display:table-cell; функционирующий

1) Кажется, это проблема рендеринга, специфичная для Firefox. Установка свойства vertical-align в div исправляет это. top, middle или bottom вроде все работает. Я сам не понимаю, что делает FF, когда есть height, но нет набора vertical-align; это может быть ошибка.

2) Ширина и высота учитываются, но на них распространяются правила размеров таблицы. Когда в таблице недостаточно места, чтобы дать каждой из ячеек указанную ширину, она даст больше места ячейкам с большим содержимым. Это то, что произошло с вашим примером. Если вы посмотрите на мой пример ниже, вы увидите, что когда родительский элемент шире, чем сумма ширин ячеек таблицы, ячейки учитывают ширину. Высота всегда должна работать (за исключением случая с рендерингом FF, о котором я упоминал выше).

3) Ячейки таблицы не имеют полей. Используйте интервалы между границами и display:table в родительском div.

http://jsfiddle.net/chad/k7esv/3/

Я просто добавлю (видя, что это, кажется, было упущено), что установка высоты для отдельных ячеек таблицы в строке таблицы может быть бессмысленной, поскольку все ячейки в одной строке таблицы станут той же высоты, что и самая высокая ячейка в указанной строке .

Сказав это, может потребоваться добавить высоту, когда динамический контент обслуживается в разных ячейках, что означает, что их высота колеблется. Возможно, вы хотите, чтобы конкретная ячейка никогда не была меньше высоты X, что вступит в силу только тогда, когда в другой определенной ячейке будет меньше содержимого.