Balanced columns

[u2orange]

Does anyone know how to acheive a flowing column effect with CSS. What I want to do is have 2 or 3 columns that strech the height of the browser window, and when the text hit's the bottom on the first column, it then flows to the second column, and so on.

I am pretty sure this is possible i.e.,
http://www.iht.com/articles/114215.html

Cheers

u2o

[Nick]

Not that I know of. The example given uses a (rather nice) set of javascript code to split it in to columns and do the paging. Check out the ihtArtic.js for the main bulk of the code.

From what I understood this is how it worked. It layed out 3 columns. Each column contains all the article text. It then "scrolls" the second so it starts at where the first column stopped. It then "scrolls" the third column down to where the second column stopped.

This is done by, for example, moving the middle DIV column (created on the fly) up to the height of the left column. Because the column is only visible in a fixed position (done by CSS I think), it looks like the the text flows between columns. Infact, it's 3 columns all with the whole article text, just moved up to give the impression of columns. It also takes in to account font size (which can be altered by the user) to line up the lines perfectly. Very clever stuff.

[u2orange]

Cheers for that! I did have a poke around in their code and styles and came to the conclusion that they had done a *very* good job. A bit of over-kill for what I want, but it does look good and work well (think I am going to recommend it in the site of the month forum).

I notice that CSS-3 is set to handle multi-columns like I want. I know Jack about CSS-3, so time to read.

http://www.w3.org/TR/2001/WD-css3-multicol-20010118/

Cheers,
u2o