Question

I’m having some trouble floating images properly alongside text in a contenteditable div. Here’s a fiddle which shows the problem: http://jsfiddle.net/trpeters1/tcLw2/10/

Would someone mind taking a look at the fiddle to provide some guidance on how to display the text alongside the image?

here’s the HTML and CSS if you want to copy paste:

<p contenteditable="true" id="local"  >
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/2/26/YellowLabradorLooking_new.jpg/260px-YellowLabradorLooking_new.jpg"> sdfasfsfasfsfdasfsafasfajksf;asjf;as;jkasfk;as;lkfjaskfjkaslfjkasfkafl;sfklfjas;fjasjdfkasfkasfl;als;fjasf;slfjasfasfsadfasfasfafasfasfafsfddas

​
CSS:

p{background:yellow;}
img{float:left;}

Answer 1

Please see Prajeesh’s comments. He answers this question: “I just saw that giving whitespaces in your long text in your original fiddle actually wraps it as you need 🙂 It was only that your line was so long it couldn’t be put alongside the image”