Divs make content overlap

[whizard]

Hello All!

I am having a slight problem, where I am pulling information from a database and putting it on the front page. Each record that gets pulled from the DB is put inside a div system, like this:

<div class="item" style="display:block;">
    <div class="item_title">
     <h2>HEADLINE HERE</h2>
    <!-- End Item_Title -->
    </div>
    <div class="item_divider">
    <!-- End Item_Divider -->
    </div>
    <div class="item_date">
     <p class="date">DATE HERE</p>
    <!-- End Item_Date -->
    </div>
    <div class="item_body">
     <div class="item_image">
    IMAGE HERE
    <!-- End Item_Image -->
     </div>
    <div class="item_text">
      <p>MAIN TEXT HERE</p>
     <!-- End Item_Text -->
     </div>
    <!-- End Item_Body -->
    </div>
        <div class="item_footer">
RELATED LINKS HERE
        <!-- End Item_Footer -->
    </div>
       <!-- End Item -->
   </div>

The problem I am having is that if the image for that story is taller than the text, the image starts to cut into the article below, throwing the whole page out of line.
For an example, go to http://www.robowhizards.com/index-new.html

and scroll down to '2006 Nano Quest Challenge Released'
and you'll see what I mean.

Thanks in Advance to anyone who checks this out!

[Arbitrator]

You need to clear your floats. Read Containing Floats first if you have no clue what I’m talking about; Containing Floats is also linked to from the top of the first resource. Quick solution: *.item { overflow: auto; }.

By the way, don’t display those badges at the bottom of your page that declare that you have valid XHTML and CSS when both your document and stylesheet are invalid. Might want to also clean up things like div.item_image { display: inline; float: left; … }; floated elements cannot be inline so that first declaration is pointless.

[whizard]

Arbitrator:

Thanks for your help! I've learned something new as well as had my problem solved.

As a note on the XHTML/CSS tags, the page you are looking at is just a sample I put up for people to look at to answer this problem. It isn't complete yet, and I certainly do not plan to include those tags on any live site erroneously.

Dan Barr