Доброго времени суток, подскажите пожалуйста какой нибудь вариант решения или метод, задача в следующем:
Е нас есть блок <div id='тянучка'> он тянущийся
(допустим начальное его значение width:800px
,
в нем лежат <div class='блок'> блоки (например их 10шт
с max-width:200px;
и float:left; )
т.е. что то вроде:
<div id='тянучка'>
<div class='блок'>1</div>
<div class='блок'>2</div>
<div class='блок'>3</div>
<div class='блок'>4</div>
<div class='блок'>5</div>
<div class='блок'>6</div>
<div class='блок'>7</div>
<div class='блок'>8</div>
<div class='блок'>9</div>
<div class='блок'>0</div>
</div>
т.е. сейчас блоки лепятся друг к другу слева и переносятся вниз как только им не хватает места.
Вопрос такой, необходимо, чтобы эти блоки при начальном значении в 800px у id='тянучка' располагались так:
1 4 7 0
2 5 8
3 6 9
т.е. в 4 в столбца,
а при уменьшении до 600 так:
1 5 9
2 6 0
3 7
4 8
думаю логика понятна, соответственно чем меньше, id='тянучка', тем меньше столбцов, чем больше, тем столбцов больше.
Решения я не от кого не прошу(хотя если кто напишет буду вовсе не против), подскажите какими манипуляциями или наборами необходимо аперировать при работе в jqueri с контентом, ведь по сути здесь нужно будет добавлять дивы, а потом их переставлять в другое место.
Заранее спасибо!