in firefox you can use the min-width property. for IE you will need to use width.expression in your css to change the width (either % or px) based on the client width.

Ok, I think I almost figured it out by using javascript and css.

I created a javascript file called "styleSheetsbyResolution2.js" with the following:

// JavaScript Document
var winW = 0, winH = 0;

if (parseInt(navigator.appVersion)>3) {
 if (navigator.appName=="Netscape") {
 winW = window.innerWidth-16;
 winH = window.innerHeight-16;
 }
 if (navigator.appName.indexOf("Microsoft")!=-1) {
 winW = document.body.offsetWidth;
 winH = document.body.offsetHeight;
 }
}
if (winW <= 1600) {
 document.write('<link rel="stylesheet" type="text/css" href="1600.css">');
}
if (winW <= 1280) {
 document.write('<link rel="stylesheet" type="text/css" href="1280.css">');
}
if (winW <= 1024) {
 document.write('<link rel="stylesheet" type="text/css" href="1024.css">');
}
if (winW <= 800) {
 document.write('<link rel="stylesheet" type="text/css" href="800.css">');
}
if (winW <= 640) {
 document.write('<link rel="stylesheet" type="text/css" href="640.css">');
}

I then created a *.css file for each resolution size; for example:

/* CSS Document */
#styleSheetsbyResolution2 {
text-align: center; margin: 0; width: 1024px;
text-align: center; margin: 0px auto; width: 1024px;
}

And then in my header of my website I added the following:

<script type="text/javascript" src="styleSheetsbyResolution2.js"></script>

<div id="styleSheetsbyResolution2">

My only issue now is I checked my current computer's resultion and I'm currently at 1024 x 768; this is why I used 1024px in my 1024.css file.

However, when I refresh my website I'm seeing a horizontal scroll bar because the website is still slightly too large for 1024px.

Shouldn't 1024px be the perfect pixel size for a 1024 x 768 resolution?

I don't understand why my website is still slighly larger than the IE window.

Thank you,

olimits7

oh boy - I think you made it way harder than it is. :)

body {
min-width: 1000px;
/*force horizontal scroll for widths <1000*/
width:expression(document.body.clientWidth < 1000 ? "998px" : "auto" );
/*set min-width for ie*/
}