I've searched this forum and searched this forum for the correct answer, but have yet to find an answer to really help me. Here's what is happening.. I've got a PDF file that I'm converting to ePub for an author and he has tables in the book, except they are turned landscape and in my mind impossible to use normal tables. Here's a picture of one of them.
Maybe there is a way to do this with a regular table via XHTML and CSS, but the many years of web developing that I've done I've never figured out how to do it. So what I did was create an image of it and insert it into the ePub. Now it was quite a few pages, 37. I got the images to display one per page in iBooks for the iPad, but once tested in Stanza it cuts the images in half and then tried it in Adobe Digital Editions and it cuts the bottom half off of the images and the next page starts up with another image.
I've used Sigil for most of this, and after tons of hours of research I have yet to find out what I'm doing wrong. I know I'm doing wrong and need help... I'm all open to help. Normally I would upload the ePub, but this book is copyrighted so I can't but I can do somethings to work around if need be.
The code I've got for the images is
Code:
div.inline {page-break-inside: avoid; margin: 0.5em 0; text-indent: 0; text-align: center; clear: both; }
div.inline img {page-break-inside: avoid; max-height: 100%; max-width: 100%;}
Code:
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis luctus imperdiet purus ut accumsan. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vel augue odio, id fermentum ligula.</p>
<div class="inline"><img alt="" src="../Images/compare01.png" />
<img alt="" src="../Images/compare02.png" />
<img alt="" src="../Images/compare03.png" />
<img alt="" src="../Images/compare04.png" />
</div>
What am I doing wrong? Thanks in advance!