View Single Post
Old 03-30-2022, 05:51 PM   #28
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: 80,083
Karma: 148029447
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
@roland1, This is the code I use. Code for a blockquote is for the offset text. .blockquote is for when the blockquote end at the end of the chapter and is used as a class <blockquote class="blockquote">. Body is to setup the layout with no widows and orphans and justified text. No need to justify the text any other place. Hr is for section break markers. It gives a 20% line to separate sections. Img is to make sure images do not go off the screen. And finally P is to setup a proper margin for paragraphs. You only need <p> in most cases. Noindent is to class P to give a paragraph or line with no indent.

Code:
blockquote {
  margin-top: 1em;
  margin-right: 1.5em;
  margin-bottom: 1em;
  margin-left: 1.5em;
}
.blockquote {
  margin-top: 1em;
  margin-right: 1.5em;
  margin-bottom: 0;
  margin-left: 1.5em;
}
body {
  widows: 1;
  orphans: 1;
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
  text-align: justify;
}
hr {
  margin-top: 1em;
  margin-right: 40%;
  margin-bottom: 0.9em;
  margin-left: 40%;
  border-top: 2px solid;
}
img {
  max-height: 100%;
  max-width: 100%;
}
p {
  margin-top: 0;
  margin-bottom: 0;
  text-indent: 1.2em;
}
.noindent {
  text-indent: 0;
}
This is what I call some good code. And not a single REM in site.

By the way, What you really should do is install ADE 2.0.1 and use that to check out how your ePub looks.

You can get ADE 2.0.1 for Windows or MAC (32-bit) here. Adobe took down the page, but The Wayback Machine still has it.
https://web.archive.org/web/20200619...downloads.html

Last edited by JSWolf; 03-30-2022 at 06:00 PM.
JSWolf is offline   Reply With Quote