Div Float with Image

Question

When I float a div with text it in the behavior is what I want but when I put an image inside, the float dosen't behave the same way and the image then goes down one line. Why is that?

Solution

Put the image before the text if you want the text on the right side of the img. to make sure the text flows to the right of the img float:left.

<div  style="float:left;">
<img src="someimg" style="float:left;"/>
<p>Text will pop on right</p>
</div>

if you first want text then image

<div  style="float:left; width:200px;">
<p style="width:80% float:left;">Text will pop on left</p>
<img src="someimg" style="width:20%"/>
</div>