Фиксированная высота TD с размахом строк в миксе - PullRequest
0 голосов
/ 13 октября 2011

Таблицы не объединяются со мной.

Это упрощенная версия таблицы, с которой я работаю: http://jsfiddle.net/bWghU/

Код ниже:

table {
    padding: 5px;   
}
table th { padding: 0 5px }
table tr { background-color: #CCC }
table tr:nth-child(odd) { background-color: #FFF }
table td { border-bottom: 1px solid #555 }

<table>
    <thead>
        <th>Data</th>
        <th>Data</th>
        <th>Data</th>
        <th>Data</th>
        <th>Data</th>
        <th>Data</th>
    </thead>
    <tbody>
        <tr>
            <td rowspan="10" style="background-color:red">this has a <br /><br /><br />min-height of ~100px<br /><br /><br /></td>
            <td>one</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
        <tr>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
        <tr>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
        <tr>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
        <tr>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td rowspan="2" style="background-color:blue">this has a <br /><br /><br />min-height of ~100px<br /><br /><br /></td>
            <td>one</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
        <tr>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
            <td>two</td>
        </tr>
    </tbody>
</table>

Как вы можете видеть, размах строк убивает мой сон фиксированной высоты.Я пробовал оборачивать div внутри (динамически), но безуспешно.

Мне нужны TD, чтобы они оставались на одной высоте, все, кроме одного с размахом строк (он должен расширяться по мере необходимости) -чтобы ТД не растягивались.

1 Ответ

1 голос
/ 17 октября 2011

Вы установили для синей ячейки размер строки 2 и минимальную высоту 100px => каждая строка должна иметь высоту 50px (100px / 2 строки).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...