Отображение в Firefox: ошибка ячейки таблицы или как работает ячейка таблицы? - PullRequest
Новая
       13

Отображение в Firefox: ошибка ячейки таблицы или как работает ячейка таблицы?

0 голосов
/ 21 января 2011

У меня есть этот код: 

<style>
    .main-table {width: 80%;}
    .box, .placeholder-box {display:table-cell; width: 26.4%;}
</style>
</head>

<body>
<table class="main-table">
    <tr>
        <div class="box">
            <h1>Venue</h1>
        </div>

        <div class="box">
            <h1>Time</h1>
        </div>

        <div class="box">
            <h1>Registry & Gifts</h1>
        </div>
    </tr>

    <tr>
        <div class="box">
            <h1>Dress</h1>
        </div>

        <div class="placeholder-box">
            [Floral placeholder thing]
        </div>

        <div class="box">
            <h1>Contact</h1>
        </div>
    </tr>
</table>

Firefox рассматривает div как все, что появляется в dom перед таблицей, поэтому в моих div нет табличной схемы. Это похоже на игнорирование display:table-cell.

Я что-то не так делаю? FF сломан? Есть ли лучший способ выложить вещи в сетке, чем с помощью таблицы?

1 Ответ

1 голос
/ 21 января 2011

Согласно xhtml.com , tr должен содержать хотя бы один th или td. Firefox, вероятно, только позволяет th или td и "исправляет" вашу ошибку за вас.

Кроме того, не могли бы вы расположить свой HTML-код следующим образом? 

.main-table {width: 80%;}
.box, .placeholder-box {display:table-cell; width: 26.4%;}

<div class="main-table">
    <div>
        <div class="box">...</div>
        <div class="box">...</div>
        <div class="box">...</div>
    </div>
</div>

Это больше соответствует цели display:table-cell.

...