Конкретное расположение строк в таблице - PullRequest
0 голосов
/ 15 марта 2011

Есть ли способ управления способом потока строк в таблице ?

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

Этот (нестандартный) HTML-код показывает ожидаемый результат, когда размер группы равен 3, но использует более одного таблица :

<style type="text/css">
    table
    {
        float: left;
        border-collapse: collapse;
    }

    td, th
    {
        border: solid black 1px;
    }
</style>

<table>
    <tr><th>ID</th><th>Name</th><th>Address</th></tr>
    <tr><td>1</td><td>John</td><td>Oregon</td></tr>
    <tr><td>2</td><td>Joe</td><td>NY</td></tr>
    <tr><td>3</td><td>Bobby</td><td>Texas</td></tr>
</table>

<table>
    <tr><th>ID</th><th>Name</th><th>Address</th></tr>
    <tr><td>4</td><td>John</td><td>Oregon</td></tr>
    <tr><td>5</td><td>Joe</td><td>NY</td></tr>
    <tr><td>6</td><td>Bobby</td><td>Texas</td></tr>
</table>

<table>
    <tr><th>ID</th><th>Name</th><th>Address</th></tr>
    <tr><td>7</td><td>John</td><td>Oregon</td></tr>
    <tr><td>8</td><td>Joe</td><td>NY</td></tr>
</table>

Вот полученный результат:

Fake horizontal rows flow layout

1 Ответ

1 голос
/ 15 марта 2011

Звучит так, как вы хотите rowgroups или colgroups. Rowgroups создаются с использованием <tbody>

<table>
  <tbody>
    <tr><th>ID</th><th>Name</th><th>Address</th></tr>
    <tr><td>4</td><td>John</td><td>Oregon</td></tr>
    <tr><td>5</td><td>Joe</td><td>NY</td></tr>
    <tr><td>6</td><td>Bobby</td><td>Texas</td></tr>
  </tbody>
  <tbody>
    <tr><th>ID</th><th>Name</th><th>Address</th></tr>
    <tr><td>7</td><td>John</td><td>Oregon</td></tr>
    <tr><td>8</td><td>Joe</td><td>NY</td></tr>
  </tbody>
</table>

http://www.w3.org/TR/html401/struct/tables.html#h-11.2.3

Тогда вы сможете разместить группы рядом друг с другом, изменив tbody s на display:table и разместив их. Это дало бы внешний вид параллельных таблиц, но все равно было бы семантически правильным.

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