01-13-2012, 11:40 AM | #1 | |
Groupie
Posts: 184
Karma: 2572
Join Date: Aug 2010
Device: Kindle
|
CSS / dropcaps
Comment from an earlier thread:
Quote:
<p class="flush"><span class=dropcaps>I</span> began And here is the CSS for dropcaps: } span.dropcaps { float: left; font-size: 3em; margin-bottom: -0.3em; margin-top: -0.3em; } Alas, both the e-ink Kindle (which supposedly doesn't support KF8 standard) and the Kindle Fire (which supposedly does) render the dropcap exactly the same. The large letter "I" appears on a line by itself, followed by the rest of that opening sentence, beginning with "began". I don't know whether this is a flaw in my CSS or in the KF8 instructions/standard. (I was pleased to see that the "flush" CSS worked as expected.... Or could my result come from the combination of float: left and flush?) |
|
01-13-2012, 12:21 PM | #2 |
♫
Posts: 660
Karma: 506380
Join Date: Aug 2010
Location: Germany
Device: Kobo Aura / PB Lux 2 / Bookeen Frontlight / Kobo Mini / Nook Color
|
Try somthing like this:
<p class="first">I began...</p> <p>normal text</p> With this css: .first:first-letter {font-size:175%;} |
01-13-2012, 03:58 PM | #3 |
Groupie
Posts: 184
Karma: 2572
Join Date: Aug 2010
Device: Kindle
|
Thanks, but no joy. The Kindles just ignore that. Evidently only the dropcap language as I gave it is allowed. Probably I futzed up the CSS somehow.
“Normal” text must use the default font size. The <font size=”…”> tag or its equivalent in CSS should not be used in “normal” text. |
01-13-2012, 04:00 PM | #4 |
Resident Curmudgeon
Posts: 74,027
Karma: 129333114
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Mobipocket ignores a lot of things ePub supports like true blockquotes.
|
01-13-2012, 04:29 PM | #5 |
♫
Posts: 660
Karma: 506380
Join Date: Aug 2010
Location: Germany
Device: Kobo Aura / PB Lux 2 / Bookeen Frontlight / Kobo Mini / Nook Color
|
No, he doesn't.
It looks like this: Maybe you use not the right tool to convert to mobi? I use calibre. Source looks like this: <body> <h4 id="heading_id_2">16.</h4> <p class="center"><img alt="-----" height="12" src="../Images/hr.gif" width="100%" /></p> <p class="first">»Kurzmeldung, Mr. Courtenay«, sagte die Stimme meiner Sekretärin. Ich drückte auf den Knopf. »Natschu in Albany auf Denunzierung des Nachbarn festgenommen. Soll ich ihn auf die Liste setzen?«</p> <p>»Verdammt noch mal!« explodierte ich. »Wie oft soll ich Ihnen grundsätzliche Anweisungen wiederholen? Natürlich kommt er auf die Liste. Warum zum Teufel nicht?«</p> |
01-13-2012, 04:56 PM | #6 |
eBook Enthusiast
Posts: 85,544
Karma: 93383043
Join Date: Nov 2006
Location: UK
Device: Kindle Oasis 2, iPad Pro 10.5", iPhone 6
|
But - and forgive me for pointing this out - that's not a drop cap. A drop cap is when the initial letter extends downwards, not upwards.
|
01-13-2012, 05:36 PM | #7 |
♫
Posts: 660
Karma: 506380
Join Date: Aug 2010
Location: Germany
Device: Kobo Aura / PB Lux 2 / Bookeen Frontlight / Kobo Mini / Nook Color
|
Ah, okay, I did not know THAT was the main point here.
In this case the "float: left;" is the culprit, and yes, unfortunately, this seems not to be supported by mobi. |
01-16-2012, 06:09 AM | #8 |
Zealot
Posts: 121
Karma: 5070
Join Date: Dec 2010
Device: none
|
|
01-18-2012, 05:05 AM | #9 | |
Bookmaker & Cat Slave
Posts: 11,462
Karma: 158448243
Join Date: Apr 2010
Location: Phoenix, AZ
Device: K2, iPad, KFire, PPW, Voyage, NookColor. 2 Droid, Oasis, Boox Note2
|
Quote:
Stupid question, but, to the OP: when did you try to generate this, using that dropcap span, and is the only result you obtained a Raised Initial? Is that correct? And did you use KG or Previewer, and I presume, since this is the SIGIL forum, and not the KINDLE or MOBI forum, nor the ePUB forum, that you used an ePUB you made in Sigil? Which you then fed to...what, KG? Or previewer, or...? Hitch |
|
01-19-2012, 12:04 AM | #10 |
Member
Posts: 10
Karma: 10
Join Date: Jan 2011
Device: none
|
This is what I did in the CSS:
span.dropcap {float: left; font-size: 4.7em; line-height: 0.8em; margin-right: 3pt; margin-bottom: -0.1em;} It sure works on my computer. |
01-19-2012, 03:44 AM | #11 |
♫
Posts: 660
Karma: 506380
Join Date: Aug 2010
Location: Germany
Device: Kobo Aura / PB Lux 2 / Bookeen Frontlight / Kobo Mini / Nook Color
|
But "float: left" does not work in mobi (at least not on my Kindle by conversion from epub with Calibre)
|
01-20-2012, 07:28 AM | #12 |
eBook Enthusiast
Posts: 85,544
Karma: 93383043
Join Date: Nov 2006
Location: UK
Device: Kindle Oasis 2, iPad Pro 10.5", iPhone 6
|
|
01-20-2012, 04:46 PM | #13 |
Resident Curmudgeon
Posts: 74,027
Karma: 129333114
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
|
01-20-2012, 04:50 PM | #14 |
eBook Enthusiast
Posts: 85,544
Karma: 93383043
Join Date: Nov 2006
Location: UK
Device: Kindle Oasis 2, iPad Pro 10.5", iPhone 6
|
|
01-20-2012, 04:58 PM | #15 |
Resident Curmudgeon
Posts: 74,027
Karma: 129333114
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
|
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
Override ePub CSS with userStyle.css? | barium | Sony Reader Dev Corner | 11 | 07-16-2011 03:25 PM |
epub CSS versus "Regular" CSS | konrad | ePub | 4 | 02-18-2011 09:29 AM |
css pseudo elements and adjacent combinators in extra css? | ldolse | Calibre | 2 | 12-21-2010 05:09 PM |
help with css | bobcdy | ePub | 2 | 02-13-2010 11:59 AM |
Dropcaps example in User Manual FAQ | jackie_w | Calibre | 7 | 10-28-2009 06:52 AM |