[RbnJrg]

Something like this:?

https://www.mobileread.com/forums/att...1&d=1369173498

I made it with the following classes:

p {
  text-align: justify;
  margin: 0;
}

.parrot {
  background: url(../Images/bird.jpg) no-repeat top left;
  background-size: 183px 307px; /* the half of 366px and 614px*/
}

.box1 {
  float: left;
  top: 0;
  left: 0;
  width: 183px; /* the half of the original width: 366px;*/
  height: 195px; /* the half of the original height: 390px; (for the square section of the img */
}

.box2 {
  clear: left;
  float: left;
  top: 0;
  left: 0;
  width: 60px; /*120px;*/
  height: 100px; /*200px;*/
}

In the .xhtml file the text goes in the following way:

<p>...something...</p>
<div class="parrot">
<p class="box1"></p>
<p class="box2"></p>
<p>...something...</p>
</div>

Maybe that code can help you.

Regards
Rubén