Hi,

 

I am building a website with resources for primary school teachers. I have built the design for the main pages of the site and everything looked fine in my computer screen. Here is a link:

 

http://www.primaryteachingresources.net/te...l/website9.html

 

However when I tried the main page at different screens resolutions the right lower part of the page started to become smaller and smaller.

 

Here is the page at 1440 X 900 (everything looks fine here):

 

http://www.flickr.com/photos/22338638@N06/3421175089/

 

 

Here it is at 1280 X 768 (still everything looks fine):

 

http://www.flickr.com/photos/22338638@N06/3421981992/

 

 

Here it is at 1024 X 768 (you can see the right lower part of the page starts to get smaller):

 

http://www.flickr.com/photos/22338638@N06/3421176179/

 

And here it is at 600 X 800 (total disaster...the right lower part gets smaller and smaller...also the letters get ones on top of another)

 

http://www.flickr.com/photos/22338638@N06/3421982902/

 

Why does this happen? I have spent the whole day trying to find out before writing here. Please give a hand.

 

Thanks a lot in advance,

 

Ivánmax

try playing around with the min widths in css, if you get no better result then make the top banner an image. this will then stop the page shrinking an smaller then the width of the image. bit of a cowboy way of doing things but it works.

 

Dan

Thanks Dan. I have already thought about that, but would really leave it as the last resource.

 

Thanks again,

 

Iván

Will it is happening because You are using percentages to define width and have designed the site for a high resolution. Try including min-width which will help and maybe make you best fit something that will fit in about 960 to 980 pixels.