I am having a problem with CSS. This is probably an amateur issue so I am hoping someone can help.

I program my website with a wide-screen computer. I don't know the exact size, but it is wider than it is tall - a new model. Everything looks great.

Then, I go and view my website on a 800x600 screen and the middle(main) content rises way up the screen and obviously looks bad.

I am floating my columns so I am not sure how to control this behavior.

Would I use min-height or max-height to control such action?

Here is my CSS if you need to see it. The CSS I am referring to is Centercoltwo (software updates):
Code:
body
{
margin:0; padding:0;
}
#threecolwrapper
{
float:left; width:100%; background-color:#772953;
}
#twocolwrapper
{
float:right; width:72%;
margin-left:15%; margin-right:14%;
border-left:ridge 6px black; border-right:ridge 6px black;
background-color:#c17ca1;
font-family: ‘Ubuntubeta’, ‘Ubuntu’, 
‘Bitstream Vera Sans’, ‘DejaVu Sans’, 
Tahoma, sans-serif;
}
/*header stuff*/
#tuxtrans
{
position:absolute;
top:0.75%;
left:75%;
width:50px;
}
#header
{
background-color:#8c5974; border:solid 3px #D2691E;
}
#header h2
{
text-align:center; font-size:0.8em; color:#FFd700;
}
i
{
font-size:1.2em; word-spacing:5px;
letter-spacing:1px; text-align:left;
padding-left:2%; padding-bottom:-5%;
color:#FFd700; font-weight:600;
margin-bottom:-2%;
}
#searchbox
{
text-align:center;
}
h1
{
padding-bottom:-4%; margin-bottom:-1%; text-align:center; word-spacing:4px; font-size:1.8em; color:#FFd700; font-weight:1300; 
text-shadow: -1px 0 black, 0 1px black,
1px 0 black, 0 -1px black;
z-index:1;
}

/*CE N T E R L I N K S*//*CE N T E R L I N K S*/
#centerlinks
{
list-style-type:none;
padding-top:5px; padding-bottom:%;
font-size:15px; text-decoration:none; 
background:#de531a; margin-bottom:1px;
border:solid 2px #8c5974;
text-align: center;
}
#centerlinks li
{
display:inline;
margin-right:0.5%;
margin-left:0.5%;
text-decoration:none;
font-color:#FFFFFF;
}
#centerlinks li:hover 
{
padding: 10px;
border-radius: 15px;
background:#FFd700;
}
#centerlinks li span
{
background:#6495ed;
}
/*CE N T E R L I N K S*//*CE N T E R L I N K S*/

.rounded-corners {
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
-khtml-border-radius: 20px;
border-radius: 20px;
}
#centercolone
{
background-color:#8c5974;
/*border:ridge 9px #FFFFFF;*/ 
width:24%;
font-size: 13px;
margin-top:2%; 
margin-right:0;
text-align:center;
margin-left:1%;
}
#centercolone ul
{
list-style: none;
padding-left:4px;
}
#centercolone h4
{
padding-left:15px;
}
#centercoltwo /*softwareupdates*/
{
background-color:#8c5974;
font-size:15px;
width:49%;
float:right;
margin-left:16%;
margin-right:6.5%;
margin-top:-60%;
min-height:-60%;
margin-bottom:25%;
}
#centercoltwo ul
{
list-style: none;
}
#centercoltwo a
{
padding-left:10px;
padding-right:10px;
}
#centercoltwo
{
padding-left:10px;
}
#centercolfour /*videostudyof*/
{
background-color:#8c5974;
width:24%; 
font-size: 13px;
margin-right:0;
text-align:center;
margin-left:1%;
}
#centercolfour ul
{
list-style: none;
padding-left:4px;
}
#centercolfive
{
background-color:#8c5974;
width:24%;
padding-left:4px; 
font-size: 16px;
margin-right:0;
text-align:left;
margin-left:1%;
list-style:none;
}
/*
@media screen and (-webkit-min-device-pixel-ratio:0) 
{
#centercolthree {margin-top:-35%;}
}
@media screen and (-webkit-min-device-pixel-ratio:0) 
{
#centercoltwo {margin-top:-35%;}
}
*/
h4
{
text-align: center;
}
#googleads
{
float:right; 
margin-top:-180px;
width:6%;
margin-right:12.5%;
margin-left:-3%;
}
#bannerad
{
text-align:center;
margin-bottom:1%;
margin-top:1%;
width:300px;
float:right;
margin-right:55%;
}
#banneradone
{
text-align:center;
margin-bottom:1%;
margin-top:1%;
width:300px;
float:right;
margin-right:40%;
}
#footer
{
width:99.55%; 
float:right;
clear:both; 
text-align:center; 
background-color: #8c5974;
border:solid 4px #D2691E;}

Here is the HTML Code.

HTML CODE:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 


<head> 
<link rel="shortcut icon" href="favicon.ico" > 
<meta http-equiv="content-type" content="text/html; charset=utf-8"/> 
<meta name="description" content=" Tux and Pucks - linux tips, HOWTOs, Video HOWTOs, Video Studies of Distros, and a touch of my personal favorites hockey and poetry"/> 
<meta name="keywords" content="hockey, linux, grudgelist, tux, boston bruins, montreal canadians, nhl, linux, ubuntu, HOWTO, ubuntu linux, edit, 
edit software sources, sources"/> 
<link rel="StyleSheet" type="text/css" href="index.css"> 
<title>Tux and Pucks: Linux and Hockey. All In One!</title> 
</head> 
<div id="threecolwrapper"> 
<div id="twocolwrapper"> 


<!--HEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADER--> 
<div id="header"> 
<!-- AddThis Button BEGIN --> 
<div class="addthis_toolbox addthis_default_style " width="100%"> 
<a class="addthis_button_preferred_1"></a> 
<a class="addthis_button_preferred_2"></a> 
<a class="addthis_button_preferred_3"></a> 
<a class="addthis_button_preferred_4"></a> 
<a class="addthis_button_compact"></a> 
</div> 
<script type="text/javascript">var addthis_config = {"data_track_clickback":true};</script> 
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=tuxandpucks"></script> 
<!-- AddThis Button END --> 



<i>A linux loving hockey fan welcomes you to...</i> 
<h1>| Tux and Pucks | Linux and Hockey. All In One! |</h1> 
<div id="tuxtrans"><img src="/images/banners/logos/tuxtrans.gif" /></div><!--tuxtrans--> 
<h2>Linux News, Software Updates, and HOWTOs With A Touch of Hockey</h2> 

<ul id="centerlinks"> 
<span><b>TaP Links</b></span> 
<li><a href=page2linux.htm>Linux</a></li> 
<li><a href=page2hockey.htm>Hockey</a></li> 
<li><a href=poetry.htm>Poetry</a></li> 
<li><a href=http://taplinuxblog.blogspot.com/>Linux Blog</a></li> 
<li><a href=http://taphockeyblog.blogspot.com/>Hockey Blog</a></li> 
<li><a href=http://www.tuxandpucks.com/webmail>TaP Webmail</a></li> 
</ul><!--centerlinks end--> 

</div><!--header--> 
<!-- End Header Stuff--><!--HEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADERHEADER--> 

<body> 

<div id="searchbox"> 
<form action="http://www.google.com/cse" id="cse-search-box" target="_blank" width="100"> 
<div> 
<input type="hidden" name="cx" value="partner-pub-8095137576406792:2044626347" /> 
<input type="hidden" name="ie" value="UTF-8" /> 
<input type="text" name="q" size="55" /> 
<input type="submit" name="sa" value="Search" /> 
</div> 
</form> 
<script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&amp;lang=en"></script> 
</div><!--searchbox--> 


<div id="centercolone" class="rounded-corners"> 
<h4>Linux HOWTO...</h4> 
<ul> 
<li>Burn Ubuntu To Disc</li> 
<li><a href="/howto/burn_ubuntu_to_disc.htm" /><img src="/images/howto/burnubuntutodisc/dvd-pic.png" ALT="discburning" width="100" height="100" /></a></li><br> 
<a href="howto.htm">Click Here For More HOWTOs</a> 
</ul> 
</div><!--centercolone--> 


<div id="googleads" class="rounded-corners"> 
<script type="text/javascript"><!-- 
google_ad_client = "ca-pub-8095137576406792"; 
/* unit1 */ 
google_ad_slot = "9332728989"; 
google_ad_width = 165; 
google_ad_height = 620; 
//--> 
</script> 
<script type="text/javascript" 
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
</script> 
</div><!--googleads--> 



<div id="centercolfour" class="rounded-corners"> 
<h4>Video Study Of...</h4> 
<ul> 
<li>lupu 5.2 (Puppy)</li> 
<li><a href="/videos/studyof/puppylinux.swf" /><img src="/images/studyof/puppy.jpg" ALT="puppylinux" Width="125" Height="70" /></a></li><br><br> 
<a href="videostudies.htm">Click Here For More Video Studies</a> 
</ul> 
</div><!--centercolfour--> 

<div id="centercolfive" class="rounded-corners"> 
<h4>Latest From The Hockey Blog...</h4> 
<p>Because He Is A Montreal Fan<br>His Blog Will Tend To Feature Them Dammit!</p> 
<ul> 
<li><a href="http://taphockeyblog.blogspot.com/">Hockey Blog</a></li> 
</ul> 
</div><!--centercolfive--> 


<div id="centercoltwo" class="rounded-corners"> 
<h4>Software Updates</h4> 
Updates For:<br>March 6 2011<hr> 

<a href="http://yorba.org/shotwell/" />~Shotwell&nbsp</a> 
<a href="http://gcc.gnu.org/" />~GNU C Compiler&nbsp</a> 
<a href="http://gcc.gnu.org/" />~GNU C++ Compiler&nbsp</a> 
<a href="http://www.scilab.org" />~Scilab&nbsp</a> 

<h4>Software Updates</h4> 
Updates For:<br>March 5 2011<hr>
Thanks,
../Randy