[RbnJrg]

Originally Posted by roger64

@RbnJrg

Hi Jorge

Thanks so much for your help. I have really spent hours trying to do it and had given up. Your EPUB looks good. I will study it closely and look how it displays on Kobo and later how it goes to PDF with Prince.

ADE is OK. Prince too. The only thing, Kobo does not agree (text mixes with image), but Kobo is backward on so many fields with formatting, I find it hardly surprising.

The code cannot be more compact and clearer. Use of background, background-size (I noted for this one to be careful) and boxes is really very convenient.

Hi Roger;

Many thanks for your words; nice to know that the code could help you. But maybe the code could be a bit simpler (and compact) If we work with an image in two sections, then we could get something like the following:

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

.float_left {
  clear: left;
  float: left;
}

And in the .xhtml file we could use:

<p>...something...</p>
<p><img class="float_left" alt="" src="../Images/bird1.jpg" /></p>
<p><img class="float_left" alt="" src="../Images/bird2.jpg" /></p>
<p>...something...</p>

Precaution: Apply the class "float_left" inside the <img> tags and not inside the <p> tags.

It works in ADE (with any font size) and maybe this solution also could work in Kobo

Regards
Rubén