PDA

View Full Version : Can CSS do this job alone?

AaronW
09-15-2003, 11:19 PM
http://www.aaron-wright.com/new/

My initial thought was "yes", but then I actually tried it and it didn't work.

Anyway, it's not the layout I'm trying to do in CSS. It's the content layout I'm trying to line up properly.

That is, 3 columns of each item (in this case, news items) and no screwy white space to the left. So for a graphic example:

http://www.aaron-wright.com/new/images/ex1.gif
http://www.aaron-wright.com/new/images/ex2.gif

Either of those layouts would be fine. The thing is, I don't want to be nesting divs. I could easily accomplish the first, but not unless I nest each div inside the other (so they stretch to fit the tallest one)

Is this doable? If so, some advice would be greatly appreciated :)

Thanks in advance.
ronaldb66
09-16-2003, 09:21 AM
Having a container (typically a div) envelop those elements that need to line up - either horizontally or vertically - would be the easiest, and a semantically defendable solution; another one would be absolute positioning, but that looks like it could get hairy.
AaronW
09-16-2003, 10:49 AM
Yeah, abs. pos. could mess things up a lot, or at least make things very tricky :P The news is spit out from a DB.

The reason I didn't want to use containers was because I wanted to be able to change the width percentage which would change how many columns were shown. (30% = 3 cols, 48% = 2, etc)
AaronW
09-16-2003, 05:28 PM
Ok, I sort of just gave up and settled for fixing their height and setting overflow to auto :P
me'
09-16-2003, 05:57 PM
Just to point out, the site looks awesome, but IMO it takes a little to long to load. On dial-ups it would be hell.
AaronW
09-16-2003, 09:10 PM
I haven't compressed the images yet. I always leave that to last :P
me'
09-16-2003, 09:11 PM
Alright, I'll let you off ;)
AaronW
09-16-2003, 09:17 PM
There. Just compressed all the JPGs. Went from 296KB to 61.7 KB
me'
09-16-2003, 09:21 PM
Eurgh! Frames! When did you put those in?!
AaronW
09-16-2003, 10:48 PM
Those aren't frames. Those are divs with overflow set to auto.

And they're the only way I could think of to keep my layout flexible. I just change a width value, and I can have as many columns as I like :D