CSS fun ^^

[Shoseki]

Heya,

Simple, yet silly question.

I want to make a div width X, height Y, then I want to string an entire series of these divs in a row, and I want them to automatically flow after each other, so that say, if I resized the page, they'd automatically fill up the box, in the same way that text does.

Does that make sense?

I am sure that it is a combination of position, display and float, but I can't remember the correct combination :S

Something like

.layoutBoxes {
width : 200px;
height : 200px;
background : #00ff00;
float : left;
display : inline;
}

and the html

<div class="layoutBoxes" />
<div class="layoutBoxes" />
<div class="layoutBoxes" />
<div class="layoutBoxes" />

Any ideas?

 

[Shoseki]

lol am confusing myself then ^^

I want to display the item, as a box, but that the boxes themselves line up one after another, so I clearly don't need display:block. But... they don't seem to line up...

weird

 

[Shoseki]

Thanks matey!

With a little testing, I found that individual divs work as I like, however, as soon as I embed another DIV inside, it falls apart.

So it looks as though I need to do tiny "table layouts" for my inner blocks, and outer inline divs to make it flow :S

I will read the article you posted first ^^ thanks again!