IMG inside a DIV floated left - covers text in IE

This is the usual, works in everything except IE problem. Actually IE6 didn't have a problem with this just IE7.

Here is the page: http://nmsu.edu/~cwyatt/untitled/figuretest.html

See the NMSU logo that covers the text? The float right works just fine here, but the left doesn't. I coppied the code below for convenience.

Any suggestions? Thanks

Code:

.figure {    text-align: center;    font-size: small;    color: #555;    margin: 0px;    padding: 10px;    } .figure img {    display: block;    margin: auto;    } .figure.on-the-left {    float: left;    margin-right: 20px;    }

Code:

<div class="figure on-the-left bordered">    <img src="http://www.nmsu.edu/images/red_logo.gif" alt="NM State University logo" width="79" height="88" /> </div>