Thread: Drop caps?
View Single Post
Old 02-07-2024, 12:33 PM   #6
nabsltd
Fanatic
nabsltd ought to be getting tired of karma fortunes by now.nabsltd ought to be getting tired of karma fortunes by now.nabsltd ought to be getting tired of karma fortunes by now.nabsltd ought to be getting tired of karma fortunes by now.nabsltd ought to be getting tired of karma fortunes by now.nabsltd ought to be getting tired of karma fortunes by now.nabsltd ought to be getting tired of karma fortunes by now.nabsltd ought to be getting tired of karma fortunes by now.nabsltd ought to be getting tired of karma fortunes by now.nabsltd ought to be getting tired of karma fortunes by now.nabsltd ought to be getting tired of karma fortunes by now.
 
Posts: 527
Karma: 9529956
Join Date: Aug 2013
Location: Hamden, CT
Device: Kindle Paperwhite (11th gen), Scribe, Kindle 4 Touch
Quote:
Originally Posted by jackm8 View Post
Amazons site mentions Drop caps as a feature in their Advanced Typesetting blurb. Does anyone know of any book example where they are used?
Here is what I use:
Code:
.text-dropcap {
  float: left;
  line-height: 32%;
  margin-top: 0.24em;
  margin-right: 0.05em;
  margin-bottom: 0;
  margin-left: 0;
  font-size: 315%; /* ePub 2 lines */
  font-weight: bold;
}

@media amzn-kf8 {
  .text-dropcap {
	  /* font-size: 265%; /* 3 lines */
    font-size: 150%; /* 2 lines */
  }
}
Then, just <p><span class="text-dropcap">T</span>he dropcap demo.</p>.

KFX responds to the "amzn-kf8" media query, so that allows you to customize the font size. You have to use a much smaller font size than you would for EPUB. It appears that Amazon is using something like the draft CSS initial-letter, where all you supply is the size and and the renderer automatically figures out how to locate the drop cap where it belongs.

Unfortunately, my code won't work with actual KF8, because KF8 uses the same sizing as EPUB, but the media query overrides that.
nabsltd is offline   Reply With Quote