js + css + screen resolution

That's very simple.
Insert inside the head-element in your html page:

<script type="text/javascript">
<!--
if ((screen.width>=1024))
{
   document.write("<link rel='stylesheet' type='text/css' href='style_1024.css' />");
}
else
{
   document.write("<link rel='stylesheet' type='text/css' href='style_800.css' />");
}
//-->
</script>

You might want to include additional markup for browsers with
javascript disabled or not supporting javascript.
Insert after the javascript tag:

<noscript><link rel="stylesheet" type="text/css" href="style_800.css" /></noscript>

What if someone is in a higher resolution than the window width. My work machine resolution is 1024 but I always keep my browser window at 800 centered on my desktop. At home my resolution is 1600 but my window is 1024 centered on the desktop. In this instance both machines would get the same css but the first one would need to scroll left and right to view.

I recommend using a single CSS file that will work in all resolutions. That way you won't have to worry about screen widths, wondow widths, or javascript.

I do second to that. Even counting the window width is not the right way since people often resize browser windows.

Best practice is to create one good, fixed solution for all resolutions or design a liquid layout.

I'll take both answers ... for this site I'll use the two css and the next I'll try a single-please all css.
Thanks for the ideas.