Wordpress multiloop

Jeg er gået lidt død her. Jeg kan simpelthen ikke få det her 2-column multiloop til at spille :-/

Af årsager jeg ikke kan se, så bliver css'en til float left og right ikke kørt korrekt. Eller er det bare mig? Mit wordpress-loop ser således ud:

 <div id="content">
 <?php if (have_posts()) : while(have_posts()) : $i++; if(($i % 2) == 0) : $wp_query->next_post(); else : the_post(); ?>
 
 <div id="left-column">
 <h1><?php the_permalink(); ?></h1>
 <?php the_content(); ?>
 </div>
 
 <?php endif; endwhile; else: ?>
 <div>Alternate content</div>
 <?php endif; ?>
 
 <?php $i = 0; rewind_posts(); ?>
 
 <?php if (have_posts()) : while(have_posts()) : $i++; if(($i % 2) !== 0) : $wp_query->next_post(); else : the_post(); ?>
 
 <div id="right-column">
 <h1><?php the_permalink(); ?></h1>
 <?php the_content(); ?>
 </div>
 
 <?php endif; endwhile; else: ?>
 <div>Alternate content</div>
 <?php endif; ?>
 </div>
 </div>

og min css siger:

 #content{
 #content{
 width: 960px;
 margin: auto;
 }
 
 #left-column{
 float: left;
 width: 400px;
 clear: none;
 background-color: teal;
 clear: none;
 }
 
 #right-column{
 float: right;
 width: 400px;
 clear: none;
 background-color: aqua;
 clear: none;
 }

Hvis der er nogen der kan forklare hvorfor det giver nedenstående ville jeg blive utroligt glad

På forhånd tak.

Resulatat pt.:
http://roskilde-open.dk/hosting/?v=unavngivet.png