fluid website layout problem

ste · #1 (**permalink**) 08-24-06, 09:06 AM

Heya guys,

I'm in the process of putting together a website for the placement I am currently on and rather than design a fixed width (e.g. 800x600)website I'm trying my hand at developing a website that can accomodate the majority of viewers and their resolutions, however this is my first time at doing it.

Things have been going ok so far, however recently I've had a problem (see attached screenshot for more info).

I think the problem is to do with the logo/header. When the broswer window is resized and it comes to the point where the logo ends, the navigation bar and below content breaks away from the right hand side of the container.

If you like (and if it'll help more I can post the code up) but I figured I'd put it out there first to see if anybody has ever encountered a similar problem.

Thanks in advance guys

jfulton · #2 (**permalink**) 08-25-06, 10:58 AM

Could you post some of your code?

If you are using floats, they will "jump" around up or down if there is enough room (width) to do so.

ste · #3 (**permalink**) 08-25-06, 11:10 AM

I worked out today that part of the problem was me applying margin: 30px; to the <body>.

I have also used the overflow as a solution to the problem (to stop the navigation splitting up from the container).

Here are the files:

Old Version: HTML / CSS

Updated Versions: HTML / CSS

I don't know what other way I can fix the problem atm