Bootstrap row fluid spans jump a line - html

Question

I'm running a query that outputs a span4 element in a row-fluid. I added code in my css to remove the margin-left on the third span4 in a row-fluid. This has also worked so far, but suddenly the one of the span4 jumps a line. Any suggestions why this suddenly stopped working?
You can see the page here:
http://dtm-auto.ch/home/
My css:
.row-fluid [class*="span"]:nth-child(3n+1) {
margin-left: 0!important;
}
My code:
<div id="content" class="clearfix row-fluid">
<div id="main" class="span12 clearfix" role="main">
<h2 class="text-left">Neue Fahrzeuge</h2>
<div class="clearfix row-fluid">
<?php
global $wp_query;
query_posts( array(
'post_type' => 'acme_product',
'posts_per_page' => 6
));
while ( $wp_query->have_posts() ) :
$wp_query->the_post();
?><?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );?>
<div id="front-new-video" class="span4">
<h3 id="car-title"><?php the_title(); ?></h3>
<div class="thumbnail wrapper">
<div class="ribbon-wrapper-green"><div class="ribbon-green">Neu</div></div>
<?php the_post_thumbnail('medium');?>
<p>Preis: <span style="color:#FEF158"><?php the_field('preis'); ?> CHF</span></p>
<p>Jahr: <span style="color:#FEF158"><?php the_field('jahr'); ?></span></p>
<p>Farbe: <span style="color:#FEF158"><?php the_field('farbe'); ?></span></p>
<p>KM: <span style="color:#FEF158"><?php the_field('km'); ?> KM</span></p>
<h4> <i class="icon-chevron-sign-right"></i> Zum Fahrzeug </h4>
</div>
</div>
<?php
endwhile;
?>
</div>
</div> <!-- end #main -->
</div> <!-- end #content -->

Answer 1

It's because you're using height: 100% on #front-new-video which doesn't really do anything because the parents height(row-fluid) needs to be defiend for height: 100% to work.
Use a fixed height or min-height instead and your problem will be solved. e.g height: 419px;