[thelist] CSS problem with divs

Joel D Canfield joel at streamliine.com
Mon Aug 13 20:02:02 CDT 2007

> I have finally decided to leave the dark side and start using CSS for 
> positioning instead of tables.

It's a good thing, despite all our whining ;)

Sign up for css-d. The best css brains are there. It's a good supplement
to thelist.

> It's going pretty well but I am having a 
> few problems, particularly the difference between position: 
> absolute and 
> position: relative, but I'm sure I'll grasp it eventually.

While you're learning, I'd strongly recommend you avoid absolute
positioning. It'll bite you every time. Absolute positioning, until you
grok it, is counterintuitive. You don't have any absolute positioning in
your css, you're just using position:fixed, which ain't the same.

> I would 
> appreciate some help on this though. As I understand this (or not, as 
> the case may be!) I have got a container box, with a 
> background image, 
> and I place the other divs inside it. This works fine in IE, but in 
> Firefox the content div does not force the bottom of the 
> container div 
> down so the background image stops short.

You have the content div set with 'height: 900px;' - the content forces
it to be taller than 900px and flow out, but the nav is only 900px tall
'cause there's nothing to force it taller. If you shrink the text in FF,
as soon as it's small enough, it appears as expected.

Er; sudden realization: you have the nav and the content floated. And
the container *not* floated. If you float the divs inside, the
containing div *collapses* - I haven't played with your code at all, but
I suspect that's also toying with your head.

Position:fixed is b0rken in IE. See Georg's info at
http://www.gunlaug.no/contents/wd_additions_17.html - he's one of the
css gurus over at css-d who's helped keep me on the path to lightness.

Sorry I'm babbling; two days of migraine are just beginning to subside,
and I'm still dopey. Dopier than usual.


More information about the thelist mailing list