Question

I am here with a very little and basic problem. I have an image and a lot of text. I want my image to occupy its space and then the remaining space should be filled with text, also the space on the right of the image. But, the text always started from the next line where the image ended. Heres the code.

<p style="float:left;">
  <img src="http://upload.wikimedia.org/wikipedia/commons/b/b1/Maria_Amalia.jpg" />
Princess Maria Amélia of Brazil (1831–1853) was the daughter of Dom Pedro I, founder of Brazil's independence and here continues my text...</p>

Jssfiddle: http://jsfiddle.net/xpncr/

Answer 1

You want to put float: left on your image.

<p>
    <img src="http://upload.wikimedia.org/wikipedia/commons/b/b1/Maria_Amalia.jpg" style="float: left;" />
    Princess Maria Amélia of Brazil (1831–1853) was the daughter of Dom Pedro I, founder of Brazil's independence and
</p> 

Jsfiddle: http://jsfiddle.net/xpncr/1/