Как создать вертикальное заполнение таблицы

Foress · October 8, 2011

Не могу понять как это осуществить. Задача такова что необходимо сделать заполнение таблицы следующим образом:

1 5 9

2 6 10

3 7 11

4 8 12

Т.е. нужно, чтоб при добавлении новых элементов div заполнение шло по столбцу.

Пример горизонтального заполнения:


<html>
<head>
<title></title>
<style>
.cell{
width:48px;
height:50px;

font-size:12px;
float:left;
border:1px solid black;
text-align:center;
}
</style>
</head>
<body>
<div id="table" style="width:200px; height:100px;">
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
<div class="cell">123</div>
</div>
</body>
</html>

Буду благодарен за подсказку.

Edited October 8, 2011 by Foress

SelenIT · October 9, 2011

Мне приходит на ум только такой способ, но он 1) использует разные подходы для IE и не-IE, 2) не работает в IE7- и, что хуже, Операх ниже 11.1. Кроссбраузерно можно скриптом, напр. JQuery-плагином masonry.

Foress · October 9, 2011

Благодарю!

Эх, жаль первый способ не везде работает, он так бы подошел мне.

Что касается второго, там же, как я понял заполнение по горизонтали идет, нет?

Sign In

Как создать вертикальное заполнение таблицы

Question

Foress

Link to comment

Share on other sites

2 answers to this question

Recommended Posts

SelenIT

Link to comment

Share on other sites

Foress

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information