View Single Post
Old 04-16-2022, 05:14 PM   #12
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: 79,847
Karma: 146918083
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
Quote:
Originally Posted by retiredbiker View Post
I use this to make books read well in my Kobo Forma, without any fancy added fonts or anything. Just plain vanilla. This meets my needs, and as others have said somebody else will find it all ugly and wrong. Maybe once in 10 books I will go outside this for special formatting.

Code:
body {
  margin-top: 0.1em;
  margin-right: 0;
  margin-bottom: .1em;
  margin-left: 0;
  font-size: 1em;
}
.indent {
  display: block;
  font-size: 1em;
  margin-top: 0em;
  margin-right: 0;
  margin-bottom: .1em;
  margin-left: 0;
  text-align: left;
  text-indent: 2em;
}
.noindent {
  display: block;
  font-size: 1em;
  margin-top: 2em;
  margin-right: 0;
  margin-bottom: .1em;
  margin-left: 0;
  text-align: left;
  text-indent: 0;
}
.chapter {
  display: block;
  font-size: 1.2em;
  font-weight: bold;
  margin-top: 1em;
  margin-right: 0;
  margin-bottom: 1em;
  margin-left: 0;
  text-align: center;
  text-indent: 0;
}
.quotations {
  display: block;
  font-style: italic;
  font-size: 1em;
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0.5em;
  margin-left: 2em;
  text-indent: 0;
}
.center {
  text-align: center;
  text-indent: 0;
  margin: .5em 0 .5em 0;
}
.right {
  text-align: right;
  text-indent: 0;
  margin: .5em 0 .5em 0;
}
.verse {
  display: block;
  font-size: 1em;
  font-style: italic;
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0.1em;
  margin-left: 3em;
  text-align: left;
  text-indent: -2em;
}
.verse1 {
  display: block;
  font-size: 1em;
  font-style: italic;
  margin-top: 1em;
  margin-right: 0;
  margin-bottom: 0.1em;
  margin-left: 3em;
  text-align: left;
  text-indent: -2em;
}
.widepic {
  height: auto; 
  width: 98%;
}
.narrowpic {
  height: auto;
  width: 50%;
}
Do you realize you lose hyphenation on Kobo if you have the text left justified?

Anyway, I've simplified your CSS slightly and added widows and orphans of 1. I also changed .indent to p so you can use just <p> for most paragraphs and not have to use a class. Otherwise the functionality is the same. I've deleted the lines you don't need and moved the text-align: left to body so you only need it once.

Code:
body {
  tyext-align: left;
  margin-top: 0.1em;
  margin-right: 0;
  margin-bottom: .1em;
  margin-left: 0;
  widows: 1;
  orphans: 1;
}
p {
  margin-top: 0em;
  margin-bottom: .1em;
  text-indent: 2em;
}
.noindent {
  margin-top: 2em;
  margin-bottom: .1em;
  text-indent: 0;
}
.chapter {
  font-size: 1.2em;
  font-weight: bold;
  margin-top: 1em;
  margin-bottom: 1em;
  text-align: center;
  text-indent: 0;
}
.quotations {
  font-style: italic;
  margin-top: 0;
  margin-bottom: 0.5em;
  margin-left: 2em;
  text-indent: 0;
}
.center {
  text-align: center;
  text-indent: 0;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.right {
  text-align: right;
  text-indent: 0;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.verse {
  font-style: italic;
  margin-top: 0;
  margin-bottom: 0.1em;
  margin-left: 3em;
  text-indent: -2em;
}
.verse1 {
  display: block;
  font-size: 1em;
  font-style: italic;
  margin-top: 1em;
  margin-bottom: 0.1em;
  margin-left: 3em;
  text-indent: -2em;
}
.widepic {
  height: auto; 
  width: 98%;
}
.narrowpic {
  height: auto;
  width: 50%;
}

Last edited by JSWolf; 04-17-2022 at 05:52 AM.
JSWolf is offline   Reply With Quote