10-13-2010, 07:06 PM | #121 | |
Groupie
Posts: 165
Karma: 339490
Join Date: May 2010
Device: nook, BlackBerry
|
Quote:
Also keep in mind that some people choose a really big font. One last keep in mind: I use inline-table because inline-block is not part of the OPS standard. Even though it works in ADE, I suggest avoiding it. It might not work on some readers, or future readers that are more strict. Oddly, inline-block passes ePubCheck. |
|
10-16-2010, 06:43 PM | #122 |
Resident Curmudgeon
Posts: 73,957
Karma: 128903250
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
|
10-16-2010, 06:44 PM | #123 |
Resident Curmudgeon
Posts: 73,957
Karma: 128903250
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
|
10-17-2010, 10:22 PM | #124 |
Groupie
Posts: 165
Karma: 339490
Join Date: May 2010
Device: nook, BlackBerry
|
I had troubles putting top and bottom margin in body. They seem to work better in @page. Maybe because body is for the entire file, whereas page is for the page as rendered by the reader. However, putting left and right margins in @page seemed to indent the ADE page numbers with the text, whereas body margins just indented the text, leaving the ADE page numbers in the margin. That's why I use body for left and right and @page for top and bottom.
Not much of an issue for some readers... nook doesn't show ADE page numbers in the margin - they are at the bottom. Same with Kobo, and I think it's also the same with Sony readers. But some show it in the margins. |
10-29-2010, 09:56 AM | #125 |
Resident Curmudgeon
Posts: 73,957
Karma: 128903250
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
The new Sony Readers 350, 650, & 950 do not show the ADE page number in the margin any longer.
I do think this is a good thing that newer versions of ADE don't show the page number. But I do think an option to show it/not show it would be good in case you are using the eBook to cite from. |
02-22-2011, 12:20 PM | #126 |
Guru
Posts: 970
Karma: 4999999
Join Date: Mar 2009
Location: Rosario, Argentina
Device: SONY PRS-505, PRS-T2
|
I am making an ePub version of PG "Sailing alone around the world", by Joshua Slocum.
This book has a lot of images, with a caption below each. The caption can be quite long, sometimes several lines of text. Some small images are positioned to the left or right, with text around, and the caption below. I've managed to implement this by puting both the image and the caption inside <div></div> tags, but I need to split the caption in several lines, so that it doesn't go beyond the width of the image. I've tried manually inserting <br /> tags inside the caption text, but that upsets centering and doesn't look as clean as I would like. I'm sure some of the css gurus here have a better solution..... |
02-23-2011, 07:20 AM | #127 |
frumious Bandersnatch
Posts: 7,516
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
You have to specify a fixed width to the <div> enclosing both the image and caption. Sadly, there's no way (that I know of) of passing the image's natural width to the <div>, but you can have something like:
Code:
<div class="illustration" id="ill-1"> <img src="image-01.jpg" alt=""/> <p class="caption">Caption.</p> </p> Code:
div.illustration { float: left; margin: 1em; } div#ill-1 { width: 20% } /* or 240 px, or 10em, or whatever */ div.illustration img { max-width: 100% } p.caption { ... } |
02-23-2011, 09:19 AM | #128 |
Guru
Posts: 970
Karma: 4999999
Join Date: Mar 2009
Location: Rosario, Argentina
Device: SONY PRS-505, PRS-T2
|
Thank you very much Jellby!!! I will give it a try.
In the meantime, I found another solution involving tables. Code:
<table class="ir"> <tr> <td> <h3 id="heading_id_25" title="Figure 18"><img height="162" src="../Images/BdIm__18.jpg" title="" width="252" /></h3> </td> </tr> <tr> <td width="252"> <p class="caption">“I suddenly remembered that I could not swim.”</p> </td> </tr> </table> Code:
.caption { font-size: 0.9em; font-weight: bold; text-align: center; text-indent: 0; margin-bottom: 1em;} .ir { float: right; margin: 3px;} It works in my Sony 505, which has an old implementation of ADE. I wonder if this would work in all readers. |
02-23-2011, 04:00 PM | #129 |
Wizard
Posts: 1,158
Karma: 32196
Join Date: Jan 2007
Location: Anchorage, AK
Device: Sony Reader PRS-505, PRS-650, PRS-T3, Pocketbook HD2
|
Is there a code for just normal wrapped rectangular images in epub? For beginners it may not hurt to show the basics before showing the advanced code like the wrapped non-rectanglar images.
|
02-23-2011, 08:01 PM | #130 |
Grand Sorcerer
Posts: 11,470
Karma: 13095790
Join Date: Aug 2007
Location: Grass Valley, CA
Device: EB 1150, EZ Reader, Literati, iPad 2 & Air 2, iPhone 7
|
the basics are all on the wiki under CSS there is also CSS HowTo for more advanced stuff.
Dale |
02-24-2011, 12:39 PM | #131 |
Wizard
Posts: 1,158
Karma: 32196
Join Date: Jan 2007
Location: Anchorage, AK
Device: Sony Reader PRS-505, PRS-650, PRS-T3, Pocketbook HD2
|
|
02-24-2011, 02:32 PM | #132 | |
Grand Sorcerer
Posts: 11,470
Karma: 13095790
Join Date: Aug 2007
Location: Grass Valley, CA
Device: EB 1150, EZ Reader, Literati, iPad 2 & Air 2, iPhone 7
|
Quote:
Dale |
|
02-24-2011, 02:52 PM | #133 |
Guru
Posts: 970
Karma: 4999999
Join Date: Mar 2009
Location: Rosario, Argentina
Device: SONY PRS-505, PRS-T2
|
I my experience the best way to learn these things is looking inside well formatted books, for example, Zelda's "Three men in a boat" or any book by Jellby. Feedbook's ePubs are also great.
|
02-24-2011, 03:47 PM | #134 |
Chocolate Grasshopper ...
Posts: 27,600
Karma: 20821184
Join Date: Mar 2008
Location: Scotland
Device: Muse HD , Cybook Gen3 , Pocketbook 302 (Black) , Nexus 10: wife has PW
|
|
02-27-2011, 08:49 PM | #135 | |
Wizard
Posts: 1,158
Karma: 32196
Join Date: Jan 2007
Location: Anchorage, AK
Device: Sony Reader PRS-505, PRS-650, PRS-T3, Pocketbook HD2
|
Quote:
|
|
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
direkter Umlaut oder lieber HTML Code in Epub ? | NASCARaddicted | Erste Hilfe | 14 | 06-16-2011 05:54 AM |
Programming language code snippets in ebooks? | Connochaetes | Writers' Corner | 7 | 10-18-2010 02:43 PM |
ebook-convert HTML to EPUB and problem with <pre><code> | mikegr | Calibre | 2 | 03-09-2010 02:27 PM |
css override code for margins? | Amalthia | Calibre | 15 | 08-11-2009 07:20 PM |
Problems generating ePub from HTML/CSS | AlexBell | Calibre | 3 | 07-17-2009 05:10 AM |