floating div problem

[rigadon]

i'm new to css and i'm having a few problems using netscape 7.0. basically I have a three column page with a footer spreading the entire width. i've floated the left and the right columns to position them correctly. i've just added a <br> to push the footer away from the content above it.

however, because the two side columns are floated the footer does not shift down enough unless the center column is longer than the side columns. to see what I mean goto:

www.wcobfc.co.uk/wcobfc_left.asp 'left is longest column
www.wcobfc.co.uk/wcobfc_center.asp 'center is longest column
www.wcobfc.co.uk/wcobfc_right.asp 'you get the idea

it all works fine on IE, just not on netscape. any suggestions???

cheers guys and gals

[Paul O'B]

Hi,

I assume you just want to move the footer away from the longest column to give a small margin?

You have use clear:both on your footer which should keep the footer below any of the longest columns. If you want the footer to move down a bit then you could add a bottom margin to each of your left, right and centre columns e.g.

#right, #main, #left {
 margin-bottom:20px;
}

(It would seem to be easier to add a margin-top to the #footer instead but it only works in IE not in Mozilla.)

I'm not sure if this is what you meant but hope it helps anyway.

Paul

[rigadon]

yeah, that's what I want to do. guess I'll just have to add the bit to the bottom of each column.

cheers