p+p indent flaky

[AlanHK]

I've see a few books using this CSS:

p{margin:0;text-align:justify;}
p+p{text-indent:1.4em;}

This idea being that the first para of a section after a heading was unindented, as it should be, the following indented.

And this works in epub readers. But when converted to AZW3 and loaded in a Kindle (PW3 with 5.10.3) I found it erratic. Every few pages a paragraph would be unindented. Checking the source, the paras were all <p>.

Also, if I changed the fontsize, reflowed the text, often the para in question would become indented.

So is this a bug in the AZW3 or is the Kindle renderer itself buggy? Has this been fixed in later versions?

In any case, I'm giving up using this "+" trick as unreliable.

[Quoth]

I use two styles in the wordprocessor, a a flush first paragraph for after any centred item and an an indented style for all others. That works perfectly. I never have to edit HTML or CSS of books converted from docx to epub2.

If it's an existing ebook using same style for all paragraphs I copy that CSS and have one with indent and one without. Then for any centred styles I search for the close of centred style tag & the paragraph defualt tag/style and replace. Very quick.

Works on Amazon's conversion from epub2 to mobi, azw3 & KFX and also for epub2 conversion to Dual Mobi for Smashwords.

[AlanHK]

Originally Posted by Quoth

I use two styles in the wordprocessor, a a flush first paragraph for after any centred item and an an indented style for all others.

That's what I've always done.
But I came across a few books that use the p+p trick and thought it was useful and made a simpler code.

However, it just does not work reliably in Kindle, so I reverted to explicitly setting each para's style.

p {margin:0; text-indent:1.4em; text-align:justify;}
.first {margin-top:1.5em; text-indent:0;}

Putting the indent in the base style so the great majority of text is just <p>
all other p styles have to set indent to 0.

[JSWolf]

This is what I use. The hr is the section break marker. It works in ePub, KF8, Mobi, KePub, and KFX.

hr {
  margin-top: 1em;
  margin-right: 40%;
  margin-bottom: 0.9em;
  margin-left: 40%;
  border-top: 2px solid;
}
p {
  margin-top: 0;
  margin-bottom: 0;
  text-indent: 1.2em;
}
.noindent {
  text-indent: 0
}

<p>Last line of the section</p>
<hr/>
<p class="noindent">This is the first line of a new section</p>

[Hitch]

Originally Posted by AlanHK

That's what I've always done.
But I came across a few books that use the p+p trick and thought it was useful and made a simpler code.

However, it just does not work reliably in Kindle, so I reverted to explicitly setting each para's style.

p {margin:0; text-indent:1.4em; text-align:justify;}
.first {margin-top:1.5em; text-indent:0;}

Putting the indent in the base style so the great majority of text is just <p>
all other p styles have to set indent to 0.

Well, to be accurate, you mean, it doesn't work in AZW3, from Calibre. Right? After all, there are several places in that workflow where things could go wonky.

What happens when you take an ePUB that has that working and drop it on KP3, instead?, Then export that as MOBI, and sideload it to your Paperwhite?

Hitch

[hobnail]

Originally Posted by AlanHK

I've see a few books using this CSS:

p{margin:0;text-align:justify;}
p+p{text-indent:1.4em;}

I was using that but it's too big of a hammer, even for me. There are times when I want an indent but the previous thing isn't a p, for example, a figure, or a div around whatever, or a blockquote. So now I use

dl + p,
hr + p,
header + p,
p:first-child {
    margin-top: 1.0em;
    text-indent: 0em;
 }

body p {
    margin: 0;
    padding: 0;
    text-indent: 2em;
}

(I like big fat indents.)

In other words, only specify where you don't want an indent. Also, the logic this way is clearer; saying "no indent for p, but then indent a p when it's after a p" can be confusing for someone looking at your css. With coding/programming it's usually better to make things clear and avoid clever tricks that could be misunderstood or hard to understand.

[Hitch]

Originally Posted by hobnail

I was using that but it's too big of a hammer, even for me. There are times when I want an indent but the previous thing isn't a p, for example, a figure, or a div around whatever, or a blockquote. So now I use

dl + p,
hr + p,
header + p,
p:first-child {
    margin-top: 1.0em;
    text-indent: 0em;
 }

body p {
    margin: 0;
    padding: 0;
    text-indent: 2em;
}

(I like big fat indents.)

OMG, you surely do.

(snippage here) With coding/programming it's usually better to make things clear and avoid clever tricks that could be misunderstood or hard to understand.

That's why God, in her infinite wisdom, made CSS commenting.

Hitch

[hobnail]

Originally Posted by Hitch

That's why God, in her infinite wisdom, made CSS commenting.

Hitch

Yes, that's true. But when the code changes only in an idealized world does everyone keep their comments up to date to match the code. So developing a habit to write clear code without clever tricks is a good strategy for when the comments don't match the code, or if they forget to write comments.

[Hitch]

Originally Posted by hobnail

Yes, that's true. But when the code changes only in an idealized world does everyone keep their comments up to date to match the code. So developing a habit to write clear code without clever tricks is a good strategy for when the comments don't match the code, or if they forget to write comments.

Sure, but I love me some comments.

Hitch

[hobnail]

Originally Posted by Hitch

Sure, but I love me some comments.

Hitch

Sure, we all do. I just don't like hacky, clever code, with or without comments. I don't want to have trouble figuring out what the code does and then wonder if it doesn't match the comment.

[JSWolf]

Originally Posted by hobnail

I was using that but it's too big of a hammer, even for me. There are times when I want an indent but the previous thing isn't a p, for example, a figure, or a div around whatever, or a blockquote. So now I use

dl + p,
hr + p,
header + p,
p:first-child {
    margin-top: 1.0em;
    text-indent: 0em;
 }

body p {
    margin: 0;
    padding: 0;
    text-indent: 2em;
}

(I like big fat indents.)

In other words, only specify where you don't want an indent. Also, the logic this way is clearer; saying "no indent for p, but then indent a p when it's after a p" can be confusing for someone looking at your css. With coding/programming it's usually better to make things clear and avoid clever tricks that could be misunderstood or hard to understand.

IMHO, it's easier to do the following...

p {
  margin-top: 0;
  margin-bottom: 0;
  text-indent: 1.2em;
}
.noindent {
  text-indent: 0;
}

Then you don't have to figure out all the stuff that can come before an indented p as all you'll need is <p class="noindent">. Problem solved. Plus, it's easier to read the HTML code.

[hobnail]

Originally Posted by JSWolf

IMHO, it's easier to do the following...

p {
  margin-top: 0;
  margin-bottom: 0;
  text-indent: 1.2em;
}
.noindent {
  text-indent: 0;
 }

Then you don't have to figure out all the stuff that can come before an indented p as all you'll need is <p class="noindent">. Problem solved. Plus, it's easier to read the HTML code.

True, but I still like to have some clever stuff. Plus, I know I'd forget to use that class every now and again.

[JSWolf]

Originally Posted by hobnail

True, but I still like to have some clever stuff. Plus, I know I'd forget to use that class every now and again.

You'd get used to it and the CSS is simpler, Keep your code as simple as possible.

[Quoth]

If you are using styles in Word or LO Writer and convert a docx to epub in Calibre and then the epub to anything else, it works on everything and the CSS & HTML isn't much different to JSWOLF's suggestion.

[Hitch]

Originally Posted by Quoth

If you are using styles in Word or LO Writer and convert a docx to epub in Calibre and then the epub to anything else, it works on everything and the CSS & HTML isn't much different to JSWOLF's suggestion.

Yes, that is true, but it's simple CSS--with styles for block-style (first) paragraphs and then the body paragraph. it won't/doesn't do p+p or the like, sadly.

Although, having said that, you can sorta do it by setting the "next paragraph" in the style of the block-style paragraph so that the next paragraph is body text, and all the ensuing paragraphs are body text, until you get to the first para of the next chapter, whereupon you use the block style and then lather-rinse-repeat. It is almost as good as using p+p. In some ways, better.

You can even do it by setting the heading style for the chapter header to have "next paragraph" be the block-style, and then the block-style has the next paragraph as body, (and proceed from there, like I said above), and do it that way.

(I do this in my Word "template" documents, which I use to show a customer what a given layout in a given font might look like. I have all the headings and styles with dependencies, so if someone thinks that they want, for example, Bookman Old Style, I can change ONE thing, ONE style in the Word doc and the change dominoes (cascades) through the entire file. Export a PDF and give them an idea of what they might be looking at. It's the same thing, really, as we're discussing with p+p.)

Hitch