Comments not showing up after modified header

I changed my header so it could have 3 columns underneath it as shown in this screenshot: Image screenshot

I added the following code so I could get those 3 columns:

<div id="head1">

<div class="head1-section1">
<h4>Header Title</h4>
<?php query_posts('showposts=5'); ?>
<ul>
<?php while (have_posts()) : the_post(); ?>
<li>
<strong><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php _e('Permanent link to'); ?> <?php the_title(); ?>"><?php the_title(); ?></a></strong><br />
<small><?php the_time('m-d-Y') ?></small>
</li>
<?php endwhile;?>
</ul>
Quisque sed felis. Aliquam sit amet felis. Quisque sed felis. Quisque sed felis. </div>

<div class="head1-section2">
<h4>Header Title</h4>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque sed felis. Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam. Etiam augue pede, molestie eget, rhoncus at, convallis ut, eros. Aliquam pharetra. Nulla in tellus eget odio sagittis blandit. Maecenas at nisl. Nullam lorem mi, eleifend a, fringilla vel, semper at, ligula. Mauris eu wisi. Ut ante dui, aliquet nec, congue non.
</div>

<div class="head1-section3">
<h4>Header Title</h4>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque sed felis. Aliquam sit amet felis. Mauris semper, velit semper laoreet dictum, quam diam dictum urna, nec placerat elit nisl in quam.
</div>

</div>

And this is the CSS:

#head1 {
	clear: both;
	height:138px;
	width:982px;
	background: #ffffff url(images/head1.gif) no-repeat;
	color: #ffffff;
	font-size: 95%;
	line-height: 130%;
	padding-bottom: 10px;
}
#head1 a, #footer a:visited {
	color: #ffffff;
}
#head1 h4 {
	font: normal 146%/100% "Trebuchet MS", Tahoma, Arial;
	color: #000000;
	margin: 10px 0px 5px;
}
.head1-section1 {
	width: 320px;
	float: left;
	margin-left: 20px;
}
.head1-section1 ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
}
.head1-section1 ul li {
	background: url(images/mini-footer-comments.gif) no-repeat;
	padding: 0px 0px 10px 20px;
}
.head1-section2 {
	width: 300px;
	float: left;
	margin-left: 10px;
}
.head1-section2 strong {
	font-size: 107%;
	line-height: 135%;
	font-weight: bold;
}
.head1-section2 ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
	font-size: 92%;
	line-height: 110%;
}
.head1-section2 ul li {
	background: url(images/mini-footer-post.gif) no-repeat;
	padding: 0px 0px 10px 20px;
}
.head1-section3 {
	width: 300px;
	float: right;
	padding-right: 10px;
	padding-left: 10px;
}

Everything was going fine until I decided to check up on the commenting page. When I did it just sent me back to the index page, no comments. So I took the columns out and it worked. I need those columns there so is there a way to keep them and have my comments page show up? Any help is greatly appreciated!