- Last post
- 9 Responses
I'm trying to put an image on the same line as some HTML text, but the problem is the text wont sit on the same line as the image.
It's being forced down to the next line. I tried using a span and nobr but neither are working.
Is the text wrapped in <p>?
The text will still break onto the next line if it's wrapped in a <p>, even if the image is set to 'display: inline'.
You could float both elements left (float:left).
<img src="http://www.claytonbailey.com/popgun11h.jpg" style="float:left;" />
<p style="float:left;">Text goes here</p>
Don't actually do it inline. Give each element a class and stick it in your stylesheet.
what you could do is float the img left if you want the text to wrap other wise float both img and p left and if possible declare a width for the p tag.
they should sit nicely together then.
Put the image in the paragraph tag and float it left. You can also try adding 'align="absmiddle"' on the image, but it's not valid XHTML.
Do you have a separate stylesheet?
Float:left is what did it. Ive used that before but forgot about it.
The general idea would be...
<p style="float: left; width: 80%">I'm trying to put an image on the same line as some HTML text, but the problem is the text wont sit on the same line as the image.</p>
<img src="my_image.png" style="float:left; width: 20%;" />
...but remember that inline styles are bad - you should definitely have a separate stylesheet like juhls said.