View Full Version : making the move from fixed to fluid layout

03-28-2008, 09:27 PM
I'm trying to make the move from fixed layout styles, where I know where everything is going to sit, to a fluid layout for those with wider screens and higher resolutions. I like using images for my banners but I'm challenged with figuring out the image width that I can use to work with all resolutions, including 800x600.

The image I'm working on has the logo and text left and center.....leaving the right hand margin open to expand with the background image that I've developed from the banner image. I've attempted to attach the banner to this thread. It seems to be working in the higher resolutions but not in 800x600 even though the image is only 743 px wide.

Are there some overall guidelines that I should follow when designing an image for the header?


03-29-2008, 05:18 PM
The image looks good for me. Did you have any code you wanted us to look at? URL?

03-31-2008, 12:35 AM
I've attached a screen print of the page in 800x600 resolution, which will explain the problem I'm seeing.


03-31-2008, 02:11 AM
It's nearly impossible to tell you what is wrong with your code unless we see it :-/
Can you put on a temporary location on the web? :-)

03-31-2008, 09:49 AM
Looks to me like the image is too big.

If the body or margins are set to a percentage then that will allow it to shrink to any size... When it shrinks smaller than your image width the image will overflow. Have a play with the wrapper values for the margins but I think you will need a smaller image if you think your audience will be using 800x600.

I'm no CSSer tho... I'd wait for someone who knows what they're talking about :wink:

03-31-2008, 02:29 PM
I've attached the code for the page template and also the style sheet. If this doesn't tell you what you need, let me know and I'll upload a temporary URL.


08-14-2008, 07:13 PM
how do you use a fluid layout (or make one)