Setting up my webpages on a widescreen monitor may have caused me to create inaccurate div positions

Question

Hi, I recently put together a website exclusively using a computer with a wide screen monitor. Later, When opening the same pages online using a computer with a smaller sized monitor, I suddenly noticed that all the div positions are completely out of place. My question is how to use the widescreen monitor to continue to develop my webpages without messing up div positions for views on regular sized monitors?

Re replies:

Thanks for the advice guys. I agree that the design of the page should be flexible enough to accommodate most browser window sizes. However, when u are working with a widescreen monitor and not paying attention it is easy to overcompensate div placements and element sizes. My next question is on how to be sure of regular browser window dimensions and how to force my browser window into that size?

Thanks Cyrena for giving me directions with the development tools. I do use them and check across browsers. But My problem here was working exclusively on a widescreen monitor with the browser maximized. I don't want to make the same mistake, so I need to figure out how to resize my browser window with the right dimensions.

Answer 1

Don't maximize your browser window? Just shrink it horizontally a bit?

But any website that has such a high dependence on the shape of your display is poorly designed. It should fit to any size display that's bigger than some minimum (no use spending extra effort to make it fit on a 100x100 pixel screen)

Answer 2

If you use IE's Developer Tools, you can resize the window to see what it would look like at different resolutions.

Check it out in: Tools > Developer Tools > Tools menu > Resize.

You will also want to make sure you are testing your website on other browser / OS combinations at the very least.

Answer 3

Two basic approaches off the top of my head:

1. Resize your browser to be the width of your minumum supported desktop/browser size.
2. Set desktop preferences to be different sizes (like profiles) and switch between them during testing phase.

The truth is that a really good looking site will never work on all browser configurations. Choose a bar and work against that.