Demó:

Ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom. Ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom. Ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom.

Két kódra van szükségünk, az egyik egy HTML, a másik pedig egy CSS kód.

HTML kód:
Ebben a kódban kell megadnod a kép URL-jét, illetve a szöveges tartalmat. Természetesen ezt a kód beillesztése után a rendes szerkesztői nézetben is megadhatod.

<div class="somediv">
<div class="floatbox"><img border="0" alt="" width="100" height="100" src="http://KÉP URL-je" /></div>
<p>Ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom. Ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom. Ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom, ide jön a szöveges tartalom.</p>
</div>

CSS kód:
Itt határozhatod meg a doboz szélességét, a keret tulajdonságait (ha nem szeretnél keretet, adj meg 0-t).  A kódban a legfontosabb részekhez találsz zárójeles magyarázatokat, ezeket nem kell törölnöd, a kód így is működik.

<style type="text/css">
.somediv{
width: 350px; /* doboz szélessége képpel együtt */
clear: left;
border: 1px solid gray; /* doboz kerete */
}
.somediv .floatbox{
float: left; /* bal vagy jobb oldalon legyen a kép */
}
* html .somediv p{
height: 1%;
}.somediv p{
margin-top: 0px; /* ennyi px-re lesz a szöveg a doboz tetejétől */
margin-left: 100px; /* ennyi px-re lesz a szöveg a bal oldaltól */
}</style>