|
|||||||
![]() |
|
|
Thread Tools | Search this Thread |
|
|
#1 |
|
Enthusiast
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 38
Karma: 10738
Join Date: Aug 2018
Device: none
|
EPUB to AZW3 (Calibre): Inconsistent line height, margins, and fonts
Hello there,
I’m converting EPUB files to AZW3 using Calibre and I’m trying to establish best practices for clean, consistent Kindle output (no unusual page borders, no forced fonts, proper margins, etc.). However, I’m running into several recurring issues: Inconsistent line height Even with the same Kindle device and identical reader settings, different converted books show noticeably different line spacing. Some books look compact, others much more airy, although the font size and line spacing settings on the Kindle are the same. Embedded fonts overriding Kindle fonts In some cases, books continue to display their original embedded font on first opening, even though I select a default font on the Kindle (Atkinson Hyperlegible). This does not happen consistently across all books. Workaround: I go to font settings, then chose one of the standard font once, then chose my font - then it works) Excessive page margins / page border look Some converted books still have larger margins then others, giving the impression of a page frame, even when Kindle margin settings are set to minimal. I assume this is caused by CSS rules in the source EPUB (line-height, margins, padding, body width, etc.), but I would like to avoid manual editing for every book if possible. Questions: What is the recommended Calibre conversion setup for EPUB to AZW3 to ensure consistent line height, no forced fonts, and minimal margins without page borders? Is it better to rely on Calibre’s Look & Feel / Styling options, or to clean and normalize the EPUB CSS beforehand? Are there specific CSS properties that Kindle tends to ignore or handle differently, such as line-height, margin, padding, or @font-face rules? Any practical advice or proven workflows would be greatly appreciated. Thanks in advance! (Note: I am not a native speaker and made this post with ai help, hope that is ok) |
|
|
|
|
|
#2 |
|
Grand Sorcerer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 14,426
Karma: 244455419
Join Date: Jan 2014
Location: Estonia
Device: Kobo Sage & Libra 2
|
The short answer is that no consistent look is possible solely with converting. As you said, books have different values for line-height and margins in the css and also can have fonts embedded in every paragraph.
You can use Look & Feel -> Styling options to bulk remove css values. For line-height it works reasonably well, but if you remove margins that way, you'll lose ALL margins in the book, including those around chapter headings and blockquotes. The result won't look nice. The same (although to a lesser extent) applies to bulk removing all fonts - you'll lose all embedded fonts, including chapter headings and blockquotes. You may be able to live with that. Personally, yes, I edit every ebook manually. Nothing else gives me the look I want across all my books. |
|
|
|
| Advert | |
|
|
|
|
#3 |
|
Enthusiast
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 38
Karma: 10738
Join Date: Aug 2018
Device: none
|
At the moment I use "Remove Font-family" and remove "line-heigh", and
Code:
@page { margin: 0 !important; }
html, body {
margin: 0 !important;
padding: 0 !important;
}
I just saw that I also could remove "margin-left" and "margin-right" (I am not very good at css though) Most novels for example do not have blockquotes and I would not really care about chapter headings, but big margins on my Kindle are really annoying. So one has to work on the books Css directly I presume? |
|
|
|
|
|
#4 | |
|
Well trained by Cats
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 31,407
Karma: 62500208
Join Date: Aug 2009
Location: The Central Coast of California
Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A
|
Quote:
Keyword: to understanding a CSS function: Box Model BTW In the Calibre Editor. View: Inspector. That even shows the model. If you expand the code ► you can select that line and the Box will show the 'effective' cascaded value, and you can backtrack to the cause . Really handy when the cause was levels deep.
|
|
|
|
|
|
|
#5 |
|
Grand Sorcerer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 14,426
Karma: 244455419
Join Date: Jan 2014
Location: Estonia
Device: Kobo Sage & Libra 2
|
That only works if the margins in the css are defined as "margin-left" and "margin-right". Often they're just lumped all together under "margin". For example, "margin: 0 1em" - the first number is top/bottom, the second left/right. Or "margin: 0 1em 0 2em" - top/right/bottom/left respectively.
|
|
|
|
| Advert | |
|
|
|
|
#6 |
|
Resident Curmudgeon
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 81,512
Karma: 150265339
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
@FelixKrull, please post (in a code block) the original CSS (of a book that shows issues) so we can have a look.
Last edited by JSWolf; 01-07-2026 at 08:26 PM. |
|
|
|
|
|
#7 |
|
Grand Sorcerer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 14,426
Karma: 244455419
Join Date: Jan 2014
Location: Estonia
Device: Kobo Sage & Libra 2
|
|
|
|
|
|
|
#8 |
|
Resident Curmudgeon
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 81,512
Karma: 150265339
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
|
|
|
|
|
|
#9 |
|
Grand Sorcerer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 14,426
Karma: 244455419
Join Date: Jan 2014
Location: Estonia
Device: Kobo Sage & Libra 2
|
|
|
|
|
|
|
#10 |
|
Resident Curmudgeon
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 81,512
Karma: 150265339
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
|
|
|
|
|
|
#11 |
|
Grand Sorcerer
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 14,426
Karma: 244455419
Join Date: Jan 2014
Location: Estonia
Device: Kobo Sage & Libra 2
|
|
|
|
|
|
|
#12 | |
|
Enthusiast
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 38
Karma: 10738
Join Date: Aug 2018
Device: none
|
Quote:
But I had a couple of books where the margins were rather large for my taste. I guess this was one of it: Code:
/* DESIGN PROFILE - Default */
/* Copyright 2020 Infogrid Pacific Pte. Ltd. All rights reserved. */
/* Activity Name: CSS Minification */
/* Created By: Infogrid Pacific */
/* Creation Date: 2020-04-17 */
/* Modified By: Infogrid Pacific */
body, section, div, table, thead, tbody, tfoot, th, td, p, pre, ul, ol, dl, dt, dd, li, span, nav, header, footer { margin: 0; padding: 0; }
body { margin: 20px; padding: 0; }
div, section { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; }
.copyright { font-size: 0.9em; line-height: 1.25em; padding-top: 1em; padding-right: 1em; padding-left: 1em; }
.copyright p { text-align: center; text-indent: 0em; margin-bottom: 0em; padding-bottom: 0em; }
.galley { font-family: "Times New Roman" , Times, serif; font-size: 1em; line-height: 1.25em; text-align: left; }
p { text-indent: 0em; margin-bottom: 0em; }
p+p { text-indent: 1.3em; }
.align-right { text-align: right; }
p.leading-line { height: 1em; text-align: center; margin: 0em; }
p.leading-line+p { text-indent: 0em; }
.firstpara { text-indent: 0em; }
.attribution { font-style: italic; text-align: right; }
p.text-small { font-size: 0.9em; }
div+p { text-indent: 0em; }
div.leading-line { height: 1em; text-align: center; margin: 0em; }
div.leading-line+p { text-indent: 0em; }
p.alt { font-family: Helvetica, Arial, sans-serif; }
.alt { font-family: Helvetica, Arial, sans-serif; }
span.smallcaps { font-variant: small-caps; }
span.text-small { font-size: 0.9em; }
.-epub-media-overlay-active, .-readium-epub-media-overlay-active { color: red; background-color: inherit; }
.Part .title-block p { text-indent: 0; }
.Chapter .title-block p { text-indent: 0; }
.Epilogue .title-block p { text-indent: 0; }
.Prologue .title-block p { text-indent: 0; }
.frontmatter .title-block p { text-indent: 0; }
.backmatter .title-block p { text-indent: 0; }
.specials .title-block p { text-indent: 0; }
.frontmatter .title-block { padding-right: 1em; margin-bottom: 1em; padding-bottom: 1em; padding-top: 2em; padding-left: 1em; text-align: center; }
.frontmatter .title-block h1 { font-size: 1.5em; line-height: 1.25em; font-weight: normal; color: rgb(0, 0, 0); text-align: center; }
.frontmatter .title-block .title-sub { font-size: 1.5em; line-height: 1.25em; text-align: inherit; }
.frontmatter .title-block .title-author { font-style: italic; line-height: 1.25em; text-align: inherit; }
.Part .title-block { padding-right: 1em; margin-bottom: 1em; padding-bottom: 0em; padding-top: 2em; padding-left: 1em; text-align: center; }
.Part .title-block .title-num { font-size: 1.60em; line-height: 1.25em; font-weight: normal; color: rgb(0, 0, 0); text-align: center; }
.Part .title-block h1 { font-size: 1.60em; line-height: 1.25em; font-weight: normal; color: rgb(0, 0, 0); text-align: center; margin-bottom: 0em; padding-bottom: 0em; }
.Part .title-block .title-sub { font-size: 1.3em; line-height: 1.25em; text-align: center; margin-bottom: 3em; }
.Chapter .title-block { padding-right: 1em; margin-bottom: 1em; padding-bottom: 1em; padding-top: 2em; padding-left: 1em; text-align: center; }
.Chapter .title-block .title-num { font-size: 1.5em; line-height: 1.25em; font-style: normal; font-weight: normal; text-align: center; }
.Chapter .title-block h1 { font-size: 1.5em; line-height: 1.25em; font-style: normal; font-weight: normal; color: rgb(0, 0, 0); text-align: center; }
.Chapter .title-block .title-sub { font-size: 1.1em; line-height: 1.25em; text-align: inherit; padding-bottom: 0.5em; }
.Chapter .title-block .title-author { font-size: 1.1em; line-height: 1.25em; font-style: italic; font-weight: normal; color: rgb(0, 0, 0); text-indent: 0; text-align: inherit; padding-bottom: 1em; }
.Epilogue .title-block { padding-right: 1em; margin-bottom: 1em; padding-bottom: 1em; padding-top: 2em; padding-left: 1em; text-align: center; }
.Epilogue .title-block .title-num { font-size: 1.5em; line-height: 1.25em; font-style: normal; font-weight: normal; text-align: center; }
.Epilogue .title-block h1 { font-size: 1.5em; line-height: 1.25em; font-style: normal; font-weight: normal; color: rgb(0, 0, 0); text-align: center; }
.Prologue .title-block { padding-right: 1em; margin-bottom: 1em; padding-bottom: 1em; padding-top: 2em; padding-left: 1em; text-align: center; }
.Prologue .title-block .title-num { font-size: 1.5em; line-height: 1.25em; font-style: normal; font-weight: normal; text-align: center; }
.Prologue .title-block h1 { font-size: 1.5em; line-height: 1.25em; font-style: normal; font-weight: normal; color: rgb(0, 0, 0); text-align: center; }
.backmatter .title-block { padding-right: 1em; margin-bottom: 1em; padding-bottom: 1em; padding-top: 2em; padding-left: 1em; text-align: center; }
.backmatter .title-block h1 { font-size: 1.5em; line-height: 1.25em; font-weight: normal; color: rgb(0, 0, 0); text-align: center; }
.backmatter .title-block .title-sub { font-size: 1.5em; line-height: 1.25em; text-align: inherit; }
.backmatter .title-block .title-author { font-style: italic; line-height: 1.25em; text-align: inherit; }
.specials .title-block { padding-right: 1em; margin-bottom: 1em; padding-bottom: 1em; padding-top: 2em; padding-left: 1em; text-align: center; }
.specials .title-block h1 { font-size: 1.5em; line-height: 1.25em; font-weight: normal; color: rgb(0, 0, 0); text-align: center; }
.specials .title-block .title-sub { font-size: 1.5em; line-height: 1.25em; text-align: inherit; }
.specials .title-block .title-author { font-style: italic; line-height: 1.25em; text-align: inherit; }
.cover { height: 100%; margin: 0 auto 0 auto; padding: 0; text-indent: 0; text-align: center; }
.cover img { height: 100%; margin: 0 auto 0 auto; padding: 0; }
.HalfTitle .title-block { padding-top: 3em; padding-right: 1em; padding-bottom: 0em; padding-left: 1em; }
.HalfTitle .title-block h1 { font-size: 1.1em; line-height: 1.25em; text-align: center; }
.ByTheSameAuthor .title-block { padding-top: 1em; padding-right: 1em; padding-bottom: 0em; padding-left: 1em; margin-bottom: 1em; }
.ByTheSameAuthor .title-block h1 { font-size: 0.9em; line-height: 1.25em; text-align: center; font-style: normal; }
.ByTheSameAuthor p { font-size: 0.9em; line-height: 1.25em; text-indent: 0em; text-align: center; }
.Epigraph div.epigraph { padding-top: 3em; }
.Epigraph div.epigraph-verse { padding-top: 1em; }
.Epigraph div.epigraph+p { font-size: 0em; line-height: 0em; margin: 0em; }
.Epigraph div.epigraph+p+div.epigraph { padding-top: 0em; margin-top: 0em; }
.Acknowledgements p { font-style: italic; text-indent: 0em; text-align: center; }
.title-block-book { font-size: 1em; line-height: 1.25em; text-align: center; padding-top: 3em; }
.title-block-book h1 { font-size: 2.2em; line-height: 1.25em; font-style: normal; font-weight: normal; color: rgb(0, 0, 0); text-align: center; padding-bottom: 0em; margin-bottom: 0em; }
.title-block-book .title-sub { font-size: 1.3em; line-height: 1.25em; font-style: normal; font-weight: normal; color: rgb(0, 0, 0); text-indent: 0em; text-align: center; padding-bottom: 1.5em; }
.title-block-book .title-author { font-size: 1.5em; line-height: 1.25em; font-style: normal; font-weight: normal; text-indent: 0em; text-align: center; padding-bottom: 1.5em; }
.imprint { text-align: center; margin-top: 2em; padding-top: 2em; padding-top: 0em; padding-bottom: 0em; }
.imprint p { font-size: 1em; font-style: normal; font-weight: normal; line-height: 1.25em; text-indent: 0em; }
.imprint img { width: 4.25em; height: 3em; margin: 0; padding: 0; }
.title-block-book p { font-size: 1em; line-height: 1.25em; padding-bottom: 0.5em; text-align: inherit; font-weight: normal; font-style: normal; text-indent: 0em; }
.title-block-book p+p { text-indent: 0em; }
.block h4 { font-size: 1em; line-height: 1.25em; text-align: left; text-indent: 0em; font-style: normal; font-weight: bold; margin-top: 1em; margin-right: 0em; margin-bottom: 1em; margin-left: 0em; padding-top: 0em; padding-right: 0em; padding-bottom: 0em; padding-left: 0em; }
.block h5 { font-size: 0.9em; line-height: 1.25em; text-align: left; text-indent: 0em; font-style: italic; font-weight: bold; margin-top: 1em; margin-right: 0em; margin-bottom: 0em; margin-left: 0em; padding-top: 0em; padding-right: 0em; padding-bottom: 0em; padding-left: 0em; }
.block h6 { font-size: 0.9em; line-height: 1.25em; text-align: left; font-style: italic; margin-top: 0.5em; margin-right: 0em; margin-bottom: 0em; margin-left: 0em; padding-top: 0em; padding-right: 0em; padding-bottom: 0em; padding-left: 0em; }
div.epigraph { font-size: 1em; line-height: 1.25em; margin-top: 1em; margin-right: 10%; margin-bottom: 1em; margin-left: 10%; }
div.epigraph p { font-style: italic; }
div.epigraph .attribution { font-style: normal; text-align: right; margin-top: 0em; margin-bottom: 0em; }
div.epigraph+p.leading-line { font-size: 0em; line-height: 0em; margin: 0em; }
div.epigraph+p.leading-line+div.epigraph { padding-top: 0em; margin-top: 0em; }
div.epigraph+p.blank-line+div.epigraph { padding-top: 0em; margin-top: 0em; }
div.extract { font-size: 1em; font-style: italic; line-height: 1.25em; margin-top: 1em; margin-right: 1em; margin-bottom: 1em; margin-left: 1em; }
div.extract .attribution { text-align: right; margin-top: 0em; font-style: normal; }
div.extract+p.leading-line { font-size: 0em; line-height: 0em; margin: 0em; }
div.extract+p.leading-line+div.extract { padding-top: 0em; margin-top: 0em; }
div.extract+p.blank-line+div.extract { padding-top: 0em; margin-top: 0em; }
div.extract+div.extract { font-size: 1em; font-style: italic; line-height: 1.25em; margin-top: 0em; margin-right: 1em; margin-bottom: 1em; margin-left: 1em; }
.Copyright { padding-top: 1.5em; }
.Frontispiece .media .figure { text-align: center; }
.Frontispiece .media .pc { text-align: center; width: auto; }
.Frontispiece .media .pc img { width: auto; }
div.align-right { display: block; text-align:right; margin-left: auto; }
.align-right table { margin: 0em 0em 0em auto; }
.section-break { font-size: 12px; font-weight: bold; font-family: Arial, sans-serif; text-align: center; background-color: rgb(220, 220, 220); border-top: 1px solid rgb(120, 120, 120); border-bottom: 1px solid rgb(120, 120, 120); padding-top: 15px; }
.galley { padding: 0em 0.5em 0em 0.5em; }
div.align-left.width-10 { margin-right:90%; }
div.align-left.width-20 { margin-right:80%; }
div.align-left.width-30 { margin-right:70%; }
div.align-left.width-40 { margin-right:60%; }
div.align-left.width-50 { margin-right:50%; }
div.align-left.width-60 { margin-right:40%; }
div.align-left.width-70 { margin-right:30%; }
div.align-left.width-80 { margin-right:20%; }
div.align-left.width-90 { margin-right:10%; }
div.align-center.width-10 { margin-left:45%; margin-right:45%; }
div.align-center.width-20 { margin-left:40%; margin-right:40%; }
div.align-center.width-30 { margin-left:35%; margin-right:35%; }
div.align-center.width-40 { margin-left:30%; margin-right:30%; }
div.align-center.width-50 { margin-left:25%; margin-right:25%; }
div.align-center.width-60 { margin-left:20%; margin-right:20%; }
div.align-center.width-70 { margin-left:15%; margin-right:15%; }
div.align-center.width-80 { margin-left:10%; margin-right:10%; }
div.align-center.width-90 { margin-left:5%; margin-right:5%; }
div.align-right.width-10 { margin-left:90%; }
div.align-right.width-20 { margin-left:80%; }
div.align-right.width-30 { margin-left:70%; }
div.align-right.width-40 { margin-left:60%; }
div.align-right.width-50 { margin-left:50%; }
div.align-right.width-60 { margin-left:40%; }
div.align-right.width-70 { margin-left:30%; }
div.align-right.width-80 { margin-left:20%; }
div.align-right.width-90 { margin-left:10%; }
div.floatgalley-left.width-10 { margin: 0.5em 1em 0.5em 0 !important; }
div.floatgalley-left.width-20 { margin: 0.5em 1em 0.5em 0 !important; }
div.floatgalley-left.width-30 { margin: 0.5em 1em 0.5em 0 !important; }
div.floatgalley-left.width-40 { margin: 0.5em 1em 0.5em 0 !important; }
div.floatgalley-left.width-50 { margin: 0.5em 1em 0.5em 0 !important; }
div.floatgalley-left.width-60 { margin: 0.5em 1em 0.5em 0 !important; }
div.floatgalley-left.width-70 { margin: 0.5em 1em 0.5em 0 !important; }
div.floatgalley-left.width-80 { margin: 0.5em 1em 0.5em 0 !important; }
div.floatgalley-left.width-90 { margin: 0.5em 1em 0.5em 0 !important; }
div.floatgalley-right.width-10 { margin: 0.5em 0 0.5em 1em !important; }
div.floatgalley-right.width-20 { margin: 0.5em 0 0.5em 1em !important; }
div.floatgalley-right.width-30 { margin: 0.5em 0 0.5em 1em !important; }
div.floatgalley-right.width-40 { margin: 0.5em 0 0.5em 1em !important; }
div.floatgalley-right.width-50 { margin: 0.5em 0 0.5em 1em !important; }
div.floatgalley-right.width-60 { margin: 0.5em 0 0.5em 1em !important; }
div.floatgalley-right.width-70 { margin: 0.5em 0 0.5em 1em !important; }
div.floatgalley-right.width-80 { margin: 0.5em 0 0.5em 1em !important; }
div.floatgalley-right.width-90 { margin: 0.5em 0 0.5em 1em !important; }
|
|
|
|
|
|
|
#13 |
|
Well trained by Cats
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 31,407
Karma: 62500208
Join Date: Aug 2009
Location: The Central Coast of California
Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A
|
[QUOTE=FelixKrull;4558872
I don't see why this books needs 150 lines of css anyway...[/QUOTE] It is called a 'House Stylesheet'. The coders are supposed to follow it correctly for the section they are coding. Right!If you use Tools: Reports IN THE EDITOR, you can see how many times each is actually used. The EDITOR can auto remove unused entries. It also has the option to merge identical styles. |
|
|
|
|
|
#14 |
|
Resident Curmudgeon
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 81,512
Karma: 150265339
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
In the posted CSS, the body is the problem. It has a margin of 20px in all 4 directions.
|
|
|
|
|
|
#15 |
|
Enthusiast
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 38
Karma: 10738
Join Date: Aug 2018
Device: none
|
|
|
|
|
![]() |
|
Similar Threads
|
||||
| Thread | Thread Starter | Forum | Replies | Last Post |
| Epub to KFX / AZW3 - Different line spacing, margins | Void42 | Conversion | 4 | 03-21-2021 08:05 AM |
| Line-height from ePub to AW3 | ElMiko | Conversion | 11 | 01-20-2019 03:44 PM |
| Page Margins and Line Height | Aeslynn | Kindle Developer's Corner | 7 | 02-06-2016 09:07 PM |
| resolving presentation issues with Kobo Touch (fonts, line height etc) | digital punk | Kobo Reader | 9 | 01-21-2014 03:00 AM |
| Epub line height problem | dorotie | Calibre | 5 | 08-24-2010 04:23 PM |