Well, now I am home and I have more freedom to write you. There are -at least- three ways to get what you want:
First Method:
a) In your .xhtml file:
Code:
<p><img class="fl" alt="Tropical Beach" src="../Images/Tropical%20Beach.jpg"/>Lorem ipsum dolor sit amet, consectetur ... id est laborum.</p>
b) In your .css file:
Code:
img.fl {
float: left;
with: 100%;
max-width: 9000px; /* This property is not well supported under epub2 */
padding: 0 0.5em 0.5em 0;
}
Second Method:
a) In your .xhtml file:
Code:
<div class="image50L>
<img alt="Tropical Beach" src="../Images/Tropical%20Beach.jpg"/>
</div>
<p>Lorem ipsum dolor sit amet, consectetur ... id est laborum.</p>
b) In your .css file:
Code:
.image50L {
float: left;
width: 50%;
padding: 0 0.5em 0.5em 0;
}
.image50L img {
with: 100%;
max-width: 9000px; /* This property is not well supported under epub2 */
}
Third Method:
a) In your .xhtml file:
Code:
<div class="image50L>
<img alt="Tropical Beach" src="../Images/Tropical%20Beach.jpg"/>
<p>Lorem ipsum dolor sit amet, consectetur ... id est laborum.</p>
</div>
b) In your .css file:
Code:
.image50L {
width: 100%;
}
.image50L img {
float: left;
with: 50%;
max-width: 9000px; /* This property is not well supported under epub2 */
padding: 0 0.5em 0.5em 0;
}
With any of the three methods, you'll get what you want. If not, then there is something wrong with your ereader (maybe are you using CoolReader or FBReader or Readera?)
EDIT: I attach an epub with the three methods so you can test it