Duplicates of clearfloat

There is something strange with the integration of my php and css. I basically have a left column and a right column. Each column has a clearfloat div class assigned to it. This is the code for the right column:

<div class="rightcol">
<?php $display_categories = explode(',', get_option('sirup_right_cat') ); foreach ($display_categories as $category) { ?>
<div class="clearfloat">
          <?php query_posts("showposts=1&cat=$category"); $wp_query->is_category = false; $wp_query->is_archive = false; $wp_query->is_home = true; ?>
      <?php while (have_posts()) : the_post(); ?>

      <h2><a href="<?php the_permalink() ?>" rel="bookmark" class="title"><?php the_title(); ?></a></h2>

       <?php $values = get_post_custom_values("Image");
        if (isset($values[0])) { ?>
         <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>">
        <img src="<?php bloginfo('url'); echo get_option('sirup_upload_path'); $values = get_post_custom_values("Image"); echo $values[0]; ?>" alt="" width="120" height="135"/></a>

         <?php } ?>
      <?php the_excerpt(); ?>
<div style="clear:both;"></div>
<?php the_time('F jS, Y') ?>
      <?php endwhile; ?>
    </div>
    <?php } ?>
  </div>

I wanted to do was in my CSS, assign .clearfloat to have a border-bottom: 1px dotted #999 so that in each column, 3 by 2 rows of images would have a bottom border.

The problem is when I view the index.php, it spits out too many instances of the .clearfloat so there are many duplicates of the dotted border on top of each other.

How can I fix this?