Register Guidelines E-Books Search Today's Posts Mark Forums Read

Go Back   MobileRead Forums > E-Book Formats > ePub

Notices

Reply
 
Thread Tools Search this Thread
Old 05-18-2020, 04:05 PM   #1
increase
Connoisseur
increase began at the beginning.
 
increase's Avatar
 
Posts: 60
Karma: 10
Join Date: Jan 2020
Device: kindle
Drop cap in epub3 for Kindle

I have created a drop cap as follows
<p><span class="first-letter">T</span>

with css

.first-letter {
font-family: 'English';
color:#986335;
border-bottom-width: 0;
border-left-width: 0;
border-right-width: 0;
border-top-width: 0;
float: left;
font-size: 3.91625em;
height: 1.1em;
line-height: 0.8em;
padding: 0%;
margin: 0% 0.04em
}

My issue is that in the Kindle previewer 3, this code works perfectly, however when I use the KDP edit and launch the previewer, the Drop Cap is as shown in the attached image.

I have tried many different coding from the forum, but all with the same result.

Is there a way of applying Drop Cap, using epub3 in Sigil?
Attached Thumbnails
Click image for larger version

Name:	error.png
Views:	33
Size:	9.0 KB
ID:	179333  
increase is offline   Reply With Quote
Old 05-18-2020, 04:16 PM   #2
Deskisamess
Wizard
Deskisamess ought to be getting tired of karma fortunes by now.Deskisamess ought to be getting tired of karma fortunes by now.Deskisamess ought to be getting tired of karma fortunes by now.Deskisamess ought to be getting tired of karma fortunes by now.Deskisamess ought to be getting tired of karma fortunes by now.Deskisamess ought to be getting tired of karma fortunes by now.Deskisamess ought to be getting tired of karma fortunes by now.Deskisamess ought to be getting tired of karma fortunes by now.Deskisamess ought to be getting tired of karma fortunes by now.Deskisamess ought to be getting tired of karma fortunes by now.Deskisamess ought to be getting tired of karma fortunes by now.
 
Deskisamess's Avatar
 
Posts: 1,547
Karma: 20335589
Join Date: Sep 2012
Location: Ohio
Device: iPhone 7+, iPad mini, 2018 iPad Pro 12.9", KO2, Paperwhite 2019
As a reader, I despise drop caps.

Carry on.
Deskisamess is offline   Reply With Quote
Old 05-18-2020, 05:14 PM   #3
Quoth
the rook, bossing Never.
Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.Quoth ought to be getting tired of karma fortunes by now.
 
Quoth's Avatar
 
Posts: 1,846
Karma: 8530352
Join Date: Jun 2017
Location: Ireland
Device: Both Kinds: epub based makes and Kindle
1) I don't like them on printed works either.
2) They only seem to work on some formats.
Quoth is offline   Reply With Quote
Old 05-18-2020, 05:27 PM   #4
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 56,916
Karma: 52002826
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
That is NOT a drop cap. That's an enlarged first letter and it doesn't work on a Kindle because the first line is too far away from the second line. You can do this in ePub, but not in Mobi, KF8, or KFX.

A drop cap is when it is a larger letter and it descends 2 or 3 lines and the top of the letter is at the top of the first line with the text to the right of the larger letter.
JSWolf is offline   Reply With Quote
Old 05-18-2020, 05:34 PM   #5
DNSB
Bibliophagist
DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.
 
DNSB's Avatar
 
Posts: 7,430
Karma: 32971131
Join Date: Jul 2010
Location: Vancouver
Device: Kobo Forma, Clara HD, Nexus 7 HD, iPad Pro, Tolino epos
I despise using drop caps since they basically need to be tweaked for every format and ereader. That being said, the larger the font size for a drop cap compared to the body text, the harder it is to to make it look half decent on multiple platforms. One book I worked on used a cursive font for the drop caps. I ended up with a separate class for each letter used as a drop cap and another class for the case where a double quote preceded the first letter. It ended up looking half decent on 768x1024 or larger displays but the CSS was a dog's breakfast.

The basic code looks like this with the margins being tweaked for the individual characters:

.first-letter-t {
float: left;
font-size: 300%;
margin-left: 0.03em;
margin-top: -0.3em;
margin-right: 0.12em;
margin-bottom: -0.36em;
font-weight: bold;
}

Last edited by DNSB; 05-18-2020 at 05:42 PM.
DNSB is offline   Reply With Quote
Old 05-18-2020, 05:45 PM   #6
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 56,916
Karma: 52002826
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
Quote:
Originally Posted by DNSB View Post
I despise using drop caps since they basically need to be tweaked for every format and ereader. That being said, the larger the font size for a drop cap compared to the body text, the harder it is to to make it look half decent on multiple platforms. One book I worked on used a cursive font for the drop caps. I ended up with a separate class for each letter used as a drop cap and another class for the case where a double quote preceded the first letter. It ended up looking half decent on 768x1024 or larger displays but the CSS was a dog's breakfast.

The basic code looks like this with the margins being tweaked for the individual characters:

.first-letter-t {
float: left;
font-size: 300%;
margin-left: 0.03em;
margin-top: -0.3em;
margin-right: 0.12em;
margin-bottom: -0.36em;
font-weight: bold;
}
This is CSS for a dropcap. The CSS in the first post is not for a dropcap.
JSWolf is offline   Reply With Quote
Old 05-18-2020, 11:57 PM   #7
DNSB
Bibliophagist
DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.
 
DNSB's Avatar
 
Posts: 7,430
Karma: 32971131
Join Date: Jul 2010
Location: Vancouver
Device: Kobo Forma, Clara HD, Nexus 7 HD, iPad Pro, Tolino epos
Quote:
Originally Posted by JSWolf View Post
This is CSS for a dropcap. The CSS in the first post is not for a dropcap.
The OP did say he was creating a drop cap using the code he posted. Yes, what he is generating is technically an initial cap which is probably the easiest to code. Hopefully, he will get some help in generating code that will result in a drop cap if that is what he wants.

If worse comes to worse, using images tends to be the best answer for drop caps across multiple platforms.

One of the earliest guides I ran into is Drop Caps: Historical Use And Current Best Practices With CSS. One of the things I liked is that she did not present any one best answer but instead looked at the various ways of doing drop caps.

I seem to remember that there was another useful entry on Elizabeth Castro's Pigs, Gourds and Wikis page but I can no longer locate it.
DNSB is offline   Reply With Quote
Old 05-19-2020, 04:12 AM   #8
increase
Connoisseur
increase began at the beginning.
 
increase's Avatar
 
Posts: 60
Karma: 10
Join Date: Jan 2020
Device: kindle
Quote:
Originally Posted by DNSB View Post
I despise using drop caps since they basically need to be tweaked for every format and ereader. That being said, the larger the font size for a drop cap compared to the body text, the harder it is to to make it look half decent on multiple platforms. One book I worked on used a cursive font for the drop caps. I ended up with a separate class for each letter used as a drop cap and another class for the case where a double quote preceded the first letter. It ended up looking half decent on 768x1024 or larger displays but the CSS was a dog's breakfast.

The basic code looks like this with the margins being tweaked for the individual characters:

.first-letter-t {
float: left;
font-size: 300%;
margin-left: 0.03em;
margin-top: -0.3em;
margin-right: 0.12em;
margin-bottom: -0.36em;
font-weight: bold;
}
Thank you, I ended up using your code
increase is offline   Reply With Quote
Old 05-19-2020, 09:09 PM   #9
DNSB
Bibliophagist
DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.DNSB ought to be getting tired of karma fortunes by now.
 
DNSB's Avatar
 
Posts: 7,430
Karma: 32971131
Join Date: Jul 2010
Location: Vancouver
Device: Kobo Forma, Clara HD, Nexus 7 HD, iPad Pro, Tolino epos
Quote:
Originally Posted by increase View Post
Thank you, I ended up using your code
Glad to hear it helped. <sound of ego expanding>
DNSB is offline   Reply With Quote
Old 05-19-2020, 09:38 PM   #10
hobnail
Running with scissors
hobnail ought to be getting tired of karma fortunes by now.hobnail ought to be getting tired of karma fortunes by now.hobnail ought to be getting tired of karma fortunes by now.hobnail ought to be getting tired of karma fortunes by now.hobnail ought to be getting tired of karma fortunes by now.hobnail ought to be getting tired of karma fortunes by now.hobnail ought to be getting tired of karma fortunes by now.hobnail ought to be getting tired of karma fortunes by now.hobnail ought to be getting tired of karma fortunes by now.hobnail ought to be getting tired of karma fortunes by now.hobnail ought to be getting tired of karma fortunes by now.
 
Posts: 353
Karma: 2114530
Join Date: Nov 2019
Device: none
Sigil's TagMechanic makes short work of drop caps; Action type=delete, Tag name=span, Having the attribute=class, Whose value is="dropcap", and walla, all gone and into the bit bucket.
hobnail is offline   Reply With Quote
Old 05-20-2020, 05:07 AM   #11
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 56,916
Karma: 52002826
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Aura H2O, PRS-650, PRS-T1, nook STR, iPad 4, iPhone SE 2020, PW3
Quote:
Originally Posted by hobnail View Post
Sigil's TagMechanic makes short work of drop caps; Action type=delete, Tag name=span, Having the attribute=class, Whose value is="dropcap", and walla, all gone and into the bit bucket.
Diaps Editing Toolbag for Calibre also does this in the editor.
JSWolf is offline   Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Calibre changes drop cap on converting epub -> azw3 AlanHK Conversion 19 02-14-2020 10:24 AM
Aura E2 Drop cap weirdness. theducks Kobo Reader 6 12-01-2019 08:27 PM
Drop cap issue converting ePub > AZW3 Pepper Breath Conversion 14 09-17-2018 06:59 AM
Drop cap bug on Paperwhite dgatwood Kindle Formats 11 04-10-2014 04:14 AM
Aura HD Drop Cap coding help, please MacEachaidh Kobo Reader 13 08-15-2013 01:18 PM


All times are GMT -4. The time now is 01:56 AM.


MobileRead.com is a privately owned, operated and funded community.