[Turtle91]

Originally Posted by RbnJrg

The property "float: left" must be for the selector img, not for the style img50L. Use something like this:

<div class="image50L">
     <img alt="Tropical Beach" src="../Images/Tropical%20Beach.jpg"/>
     <p>Lorem ipsum ... id est laborum....</p>
</div>

.............

.image50L {
    width=100%;
}

.image50L  img {
     float: left;
     width:50%; 
     max-width: 9000px
}

No. That won’t achieve what he’s asking at all. He is trying to get the following paragraphs to flow around the image. Won’t be able to do that if the div is taking up 100% of the width.

Unfortunately I can’t open the ePub on my phone - but from your relevant text example it should work. There must be something else wrong. I will try and look at it when I get home Monday, unless someone else solves it first.

Edit:
On a completely different note: if you are using images that are 9000 pixels wide I would suggest that is WAY too large for an ePub. The file size alone would make the ePub unwieldy not to mention longer rendering times. The maximum dimension size I use is 2200px (height) for the cover image. Other images usually max out around 1000-1500 for detailed images, or 600-750 for little ones.

I don’t think this is the problem, just a typo when putting the example text. You have </hrml> at the end.

Also, check that the stylesheet is linked properly. I see the link info in the head (missing the required <title>) but it may not be the correct info. In Sigil right-click on your xhtml file in the book browser window on the left and select “link stylesheet” then check the box on the stylesheet. You can also try adding a colored border during troubleshooting to make sure it is actually applying the css.

div.image50l {width:50%; float:left; border: 1px solid red}