Kallol Das Kallol Das - 6 months ago 10
HTML Question

Float property is not working perfectly

My float property is not working very well. The next element always leaves some space on the top.

My code is:

<img src="badimage.jpg" alt="bad image" style="width:80px; height:180px;float:left"><br><br>
<p>Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolorLoren ipsum dolorLoren ipsum dolor Loren ipsum dolor
Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolorLoren ipsum dolorLoren ipsum dolor Loren ipsum dolor
Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolorLoren ipsum dolorLoren ipsum dolor Loren ipsum dolor
Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolorLoren ipsum dolorLoren ipsum dolor Loren ipsum dolor
Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolorLoren ipsum dolorLoren ipsum dolor Loren ipsum dolor
Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolor Loren ipsum dolorLoren ipsum dolorLoren ipsum dolor Loren ipsum dolor
</p>


The text does not align with the top of the image. The text leave some space on the top. How can I solve this?

Answer

Have you tried removing the <br> tags? If I understood your problem correctly that would do the trick. Here you have a fiddle with the change.