DIV floating and sizing problem

I have div sizing and floating problem. when I have tiny text it is OK:

SEE IMAGE

but look what happens when I have big text

SEE IMAGE

HTML:

<div class="news">
    <div class="img">
        <img src="url">
    </div>
    <div class="wrap">
        <div class="title">TITLE<开发者_C百科/div>
        <div class="text">TEXT</div>
    </div>
</div>

CSS:

.news{
    float:left;
    padding:5px 5px 2px 5px;
    margin-bottom:10px;
}
.news > .img{
    float:left;
    width:75px;
    margin-right:5px;
}
.news > .img > img{
    height:75px;
    width:75px;
}
.news > .wrap{
    float:left;
}
.news > .wrap > .title{
    font-size:14px;
}
.news > .wrap > .text{
    text-align:justify;
}

please help..

This tutorial should be helpful:

http://www.monkeydoit.com/wrap-text-images-css.php

You have to set width to your .wrap container.

Try :

.news {
    float:left;
    padding:5px 5px 2px 5px;
    margin-bottom:10px
}
.news .img {
    float:left;
    width:75px;
    margin-right:5px;
}
.news .wrap .title { font-size:14px; }
.news .wrap .text { text-align:justify; }

Give the correct width wrap div

or

Give the 100% width on news div