Browser Resolution

Looking at your site through 800x600 eyes I get a sideways scroll.

I had a similar prob on my old site. I overcame it by fixing the main table at 790 ish which suited 800 x 600 fine but anyone with a larger res had loads of whitespace around the edges. Looking at your code you have the top table set at 841 which is too wide for 800 x 600.

Two ways to crack it.

1) Set the top table at 100% and let the tables stretch to fit a the users screen. This can cause problems in higher resolutions if you have gradients or fixed size images in the left and right borders which you don't but it should still be considered.

2) Grab the users screen size using JavaScript and set the table widths from that. Never did work out how to do this so if you figure ut, let me know!! . Try a few JavaScript sites such as JavaScripts or JavaScriptSearch.com for free cut 'n paste scripts that you may be able to adapt to suit your site.

Hope this helps some....

Most people use 800x600

What I have found is that one should design at 100% if possible or 780 pixels wide, which will view well at 8x6, or 1024 X 768.

Believe it or not there are still some people using 640x480 but not that many.

I have difficulty designing at 100% so design my sites 780 wide and center them.

Gavin

You can use the method of 780 and center them or you could use javascript like flipper said. I have written this code to check this:
========================

// Sniffer Version 2
// Jim Cummins 2002
// Conxiondesigns
var isIE;
var isNS6;
var isNS4;
var isOther;

if(document.getElementById)
{
if(!document.all)
{
isNS6=true;
isNS=true;
}
if(document.all)
{
isIE5=true;
isIE=true;
}
}
else
{
if(document.layers)
{
isNS4=true;
isNS4=true;
}
else if(document.all)
{
isIE4=true;
isIE=true;
}
else
{
isOther=true;
}
}

// Debugger and Res Check Version 1
// Jim Cummins 2002
// Conxiondesigns
function checker()
{
if(isNS6 || isNS4)
{
availW = window.innerWidth;
availH = window.innerHeight;
}
else
{
availW = document.body.clientWidth;
availH = document.body.clientHeight;
}
var screenH = screen.height;
var screenW = screen.width;

alert('\n-[ Browsers ]-\n IE: ' + isIE + '\n NS: ' + (isNS4||isNS6) + '\n-[Screen]-\n Width: ' + screenW + '\n Height: ' + screenH + '\n Available W: ' + availW + '\n Available H: ' + availH);
}

========================
Once you copy this to the head of your document you can use the function 'checker()' to have an alert of the browser and screen resolution.
You can use this script to set the width and height of objects using javascript in the following way:

myobject.width = availW;
myobject.height = availH;

*Note*
You may have to add a "px" on the end of width for internet explorer or NS versions. I cannot remember, you may want to test around with that.
Hope this helps,
-dk

Depends on the image, but you can get an image to expand/contract with screen width - see title image in my sig.

I don't think designing for a width is a good idea - too many variables apart from screen res. You can usually get percentages to work with a bit of fiddling.

Many people don't have browser maximized, according to a chart I saw somewhere 3-6 months ago. Don't quote me, but it was something like 25% of 800x600 not maximized, and 50% of 1024x768.

Some people [no idea how many] will also have Favorites or History panels open on the left of the browser window. Then there's docked toolbars etc.

FYI, latest stats from TheCounter show over 50% still using 800x600 or smaller.

Yeah but people can maximize browser win's themselves. Its totally ridiculous to design when taking into account that people might not have a browser maximized.
-dk