DIV floating and sizing problem

Question

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</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..

score 0 · Answer 1 · answered Apr 21 '12 at 07:43

0

Give the correct width wrap div

or

Give the 100% width on news div

answered Apr 21 '12 at 07:43

ShibinRagh

6,530
4
35
57

score 0 · Answer 2 · answered Apr 26 '11 at 03:10

0

This tutorial should be helpful:

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

answered Apr 26 '11 at 03:10

Trey Carroll

2,382
4
22
28

score 0 · Answer 3 · answered Apr 26 '11 at 03:10

0

You have to set width to your .wrap container.

answered Apr 26 '11 at 03:10

Damb

14,410
6
47
49

.wrap must be dinamic in diwth – jany-biioop Apr 26 '11 at 03:12

score 0 · Answer 4 · answered Apr 26 '11 at 03:16

0

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; }

answered Apr 26 '11 at 03:16

Riba

1,108
8
10

DIV floating and sizing problem

4 Answers4