Forum Moderators: not2easy

Message Too Old, No Replies

3 column then 2 column then 3 column again

Is this possible with CSS

         

carhire

11:55 am on Mar 15, 2005 (gmt 0)

10+ Year Member



Since becoming aware of the benefits of CSS over table-based layouts I have been actively looking for sites that would present a problem to being converted to pure CSS.
I noticed a site that had lots of info on it and was laid out evenly but in a way that looked like the page had been designed with 3 columns of info, then beneath that there was a 'special offers section' with only 2 sections, then underneath that the 3 columns started again.

Something like this

1 2 3
1 2
1 2 3

Can this be done in CSS? It's probably really obvious but I can't see how it would be easily accomplished in pure CSS, while with tables it would be simple.

PS. I have just noticed that the visual layout I wrote above (with the numbers) dosen't have the centering I put into it. So imagine the middle '12' is actually centered and no left aligned.

Longhaired Genius

12:37 pm on Mar 15, 2005 (gmt 0)

10+ Year Member



Yes it can be done with CSS. I would do it by floating the columns within a separate div for each row. The centre would be given a percentage width and centred with margin: auto. But depending on the data and layout preferences, tables might be the best way to go. Tables are not incompatible with CSS. If someone was insisting that all the columns had to be the same length I would use tables and get on with my life.