I want to do blocks of text/images that wrap. I can't figure out how. Anyone know how this can be done?
Hmm, picture a row of table cells, each with a different number in it. At the end of the page, the cells would wrap and keep going.
[1] [2] [3] [4] [5] [6] | page end
[7] [8] [9] [10
However, since each page can be a different width (from the user), there is no way I could know how many of these elements will fit in one row.
Each element will have a link break in it as well, which seems to defeat horizontal lists.
Example that doesn't work (as it shrinks the divs and doesn't wrap):
Code
<div style="background-color:darkred">
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
<div style="display:table-cell;border:1px solid black;width:200px;padding:4px;">1<br />2</div>
</div>
Post has been edited 1 time(s), last time on Mar 21 2008, 11:32 pm by isolatedpurity.
None.
). The width of each element will always be the same anyways.
