ul li breaking when its upper li have long text - html

Question

when my li's height is increasing due to 2 line text of title, the li that should be dsiplayed right below of the list item is pushed to right, in my image there are 2 consecutive list items of 2 text, thats why my list item on next line is pushed right after 2 list items. the 6th image that have is pushed to right has class "tibox-6" other have class "tibox"
My CSS
.tibox{
float:left;
}
.tibox-6{
clear:left;
float:left;
}
My HTML
<ul class="movies">
<li class="tibox">
<a class="timovie_image" href="new-image-wrestling/"
title="Permalink to New Image wrestling">
<img width="166" height="250" src="15-166x250.jpg" class="attachment-166x250 wp-post-image" alt="1" />
</a>
<div class="timovie_desc">
<div><a class="timovie_link" href="new-image-wrestling/">New Image wrestling</a></div>
<div class="timovie_year">2014</div>
<div class="timovie_rating"><img src="image1.png" /> 6.4 - <img src="image2.png" /> 50%</div>
</div>
</li>
<li class="tibox">
<a class="timovie_image" href="new-image-pakistani/"
title="Permalink to New Image pakistani">
<img width="166" height="250" src="15-166x250.jpg" class="attachment-166x250 wp-post-image" alt="1" />
</a>
<div class="timovie_desc">
<div><a class="timovie_link" href="new-image-pakistani/">New Image pakistani</a></div>
<div class="timovie_year">2014</div>
<div class="timovie_rating"><img src="image1.png" /> 6.4 - <img src="image2.png" /> 50%</div>
</div>
</li>
<li class="tibox">
<a class="timovie_image" href="new-image-1-8/"
title="Permalink to New Image 1 sad sad asd as dsad">
<img width="166" height="250" src="15-166x250.jpg" class="attachment-166x250 wp-post-image" alt="1" />
</a>
<div class="timovie_desc">
<div><a class="timovie_link" href="new-image-1-8/">New Image 1 sad sad asd as dsad</a></div>
<div class="timovie_year">2014</div>
<div class="timovie_rating"><img src="image1.png" /> 6.4 - <img src="image2.png" /> 50%</div>
</div>
</li>
<li class="tibox">
<a class="timovie_image" href="new-image-1-9/"
title="Permalink to New Image 1">
<img width="166" height="250" src="15-166x250.jpg" class="attachment-166x250 wp-post-image" alt="1" />
</a>
<div class="timovie_desc">
<div><a class="timovie_link" href="new-image-1-9/">New Image 1</a></div>
<div class="timovie_year">2014</div>
<div class="timovie_rating"><img src="image1.png" /> 6.4 - <img src="image2.png" /> 50%</div>
</div>
</li>
<li class="tibox">
<a class="timovie_image" href="new-image-1-10/"
title="Permalink to New Image 1">
<img width="166" height="250" src="15-166x250.jpg" class="attachment-166x250 wp-post-image" alt="1" />
</a>
<div class="timovie_desc">
<div><a class="timovie_link" href="new-image-1-10/">New Image 1</a></div>
<div class="timovie_year">2014</div>
<div class="timovie_rating"><img src="image1.png" /> 6.4 - <img src="image2.png" /> 50%</div>
</div>
</li>
<li class="tibox">
<a class="timovie_image" href="new-image-1-11/"
title="Permalink to New Image 2">
<img width="166" height="250" src="15-166x250.jpg" class="attachment-166x250 wp-post-image" alt="1" />
</a>
<div class="timovie_desc">
<div><a class="timovie_link" href="new-image-1-11/">New Image 2</a></div>
<div class="timovie_year">2014</div>
<div class="timovie_rating"><img src="image1.png" /> 6.4 - <img src="image2.png" /> 50%</div>
</div>
</li>
<li class="tibox-6">
<a class="timovie_image" href="new-image-1-12/"
title="Permalink to New Image 1">
<img width="166" height="250" src="15-166x250.jpg" class="attachment-166x250 wp-post-image" alt="1" />
</a>
<div class="timovie_desc">
<div><a class="timovie_link" href="new-image-1-12/">New Image 1</a></div>
<div class="timovie_year">2014</div>
<div class="timovie_rating"><img src="image1.png" /> 6.4 - <img src="image2.png" /> 50%</div>
</div>
</li>
</ul>
Image Link Webpage http://i.stack.imgur.com/ctjq6.png

Answer 1

you could use display: inline-block instead of floats:
.tibox {
display: inline-block;
vertical-align: top;
}
I'm not sure how to move to the next row with every sixth element though. You could try replacing each tibox-6 with just tibox and setting width of parent ul element.