How to convert fixed layout into liquid layout?

[kristynedwards]

I'm using a pre-designed template and just made changes to it in photoshop. After deploying the page, I see it's fixed width. It looks nice on my 1600x1200 resolution, but after switching my resolution to 1280x1024, a good proportion has been chopped off. I can't even imagine what this thing must look like in 800x600. I have dreamweaver, though I've never used it. Is there a way I can just change parts of the code to make it liquid? I designed the layout for my sister and have been at it for 2 weeks now and would just like the quickest possible solution to get the job done.

Thanks in advance, Kristy

 

[anna]

I am not positive; I'm pretty new to some of this stuff, but I think you can do it by changing the width to percentages instead of pixels...

 

[craftygeek]

to be honest, if you're designing fixed width sites - you should be taking screen resolutions into account from the beginning. Most people these days have a fixed width that will fit on a 1024 width screen with allowance for a scroll bar as well - so an overall width of 950-980px is pretty good.

Its hard to comment on how to change a fixed width site into a liquid layout without knowing the design...if it has CSS image backgrounds that span the full fixed width, then you will have problems. If it doesn't have full width CSS backgrounds, then you will need to set up the widths for the main layout elements with percentage widths.

Keeping a liquid design neat & tidy is a lot harder to do than with a fixed width site...keep in mind for example that I'm viewing this page on a 24" screen with a 1920px width....others people will still have a 1024px width - thats a big size difference that has to be thought about eg, for me this forum has paragraphs that are 17" across which doesn't make for easy reading!

 

[kristynedwards]

to be honest, if you're designing fixed width sites - you should be taking screen resolutions into account from the beginning. Most people these days have a fixed width that will fit on a 1024 width screen with allowance for a scroll bar as well - so an overall width of 950-980px is pretty good.

Its hard to comment on how to change a fixed width site into a liquid layout without knowing the design...if it has CSS image backgrounds that span the full fixed width, then you will have problems. If it doesn't have full width CSS backgrounds, then you will need to set up the widths for the main layout elements with percentage widths.

Keeping a liquid design neat & tidy is a lot harder to do than with a fixed width site...keep in mind for example that I'm viewing this page on a 24" screen with a 1920px width....others people will still have a 1024px width - thats a big size difference that has to be thought about eg, for me this forum has paragraphs that are 17" across which doesn't make for easy reading!

Understood. Thanks a lot for your help. I did wind up getting it fixed by just changing the background on it. Turns out that's where all the issues was. The stuff that was made onto the background was stuff that looked crazy getting chopped off, so I just moved it in the 960 px. range and got it away from the outsides, if that makes any sense.

 

[craftygeek]

glad you managed to get it sorted