Point of "<br class="calibre1"/>"?

[enuddleyarbl]

Yep. It's not anything esoteric. It's just a lot of what I consider to be extraneous classes.

BTW: Those classes were all being used. Calibre was only able to merge three of the classes at the start (and I believe those were Calibre classes). None were deleted as unused.

[Turtle91]

Originally Posted by Karellen

<p class="copy">Introduction copyright © 1989 Hui Corporation</p>
<p class="copy">Text copyright ©1956 Hui Corporation</p>
<p class="copy">Republished in 2012</p>
<p class="copy">All rights reserved.</p>

An alternate, and IMHO cleaner, way to do this is by using a <div>:

<div class="copy">
  <p>Introduction copyright © 1989 Hui Corporation</p>
  <p>Text copyright ©1956 Hui Corporation</p>
  <p>Republished in 2012</p>
  <p>All rights reserved.</p>
</div>

CSS:

div.copy {yadda yadda}
div.copy p {yadda yadda}

That keeps the html nice and compact and you know exactly what’s going on in the <div> without the repetitive code bloat. Multiple <div> classes in your css handle the styling in an organized manner.

[Karellen]

Originally Posted by Turtle91

An alternate, and IMHO cleaner, way to do this is by using a <div>:

Yes that is a cleaner way. Thanks for the tip.

[JSWolf]

Originally Posted by Turtle91

An alternate, and IMHO cleaner, way to do this is by using a <div>:

<div class="copy">
  <p>Introduction copyright © 1989 Hui Corporation</p>
  <p>Text copyright ©1956 Hui Corporation</p>
  <p>Republished in 2012</p>
  <p>All rights reserved.</p>
</div>

CSS:

div.copy {yadda yadda}
div.copy p {yadda yadda}

That keeps the html nice and compact and you know exactly what’s going on in the <div> without the repetitive code bloat. Multiple <div> classes in your css handle the styling in an organized manner.

I don't do things like div.copy. That copy class is also used with <p>. I don't like limiting a class like that.

<div class="copy">
  <p class="noindent">Introduction copyright © 1989 Hui Corporation</p>
  <p class="noindent">Text copyright ©1956 Hui Corporation</p>
  <p class="noindent">Republished in 2012</p>
  <p class="noindent">All rights reserved.</p>
</div>

p {
  margin-top: 0;
  margin-bottom: 0;
  text-indent: 1.2em;
}
.copy {
  font-size: small;
  text-indent: 0;
  margin-top: 0.8em;
}
.noindent {
  text-indent: 0;
}

[Turtle91]

Originally Posted by JSWolf

I don't do things like div.copy. That copy class is also used with <p>. I don't like limiting a class like that.

When you are more precise in the css you don’t need to have all of those repetitive classes for each paragraph within the specified div class. Your way has more bloat in the html to save a single line in the css.

How many other places are you going to use the .copy class in your ePub?

[Jellby]

I think he means that even if you only use the "copy" class in a single <div>, you could specify the CSS simply as ".copy" instead of "div.copy", so you don't restrict it only to divs.

Personally, I prefer to be more specific in my CSS, so I know what each class is intended for, and if I later use <p class="copy"> or <em class="copy"> for something different, the generic ".copy" selector won't bite me in back.

[Hitch]

Originally Posted by DaveLessnau

The book is "Necropolis" by Michael Dempsey. It was published in 2011 by Night Shade Books. The number of paragraph classes seems a tad excessive to me. But what really bothered me was that with their defaults, every character was something like 3/4 of normal size and the character spacing reduced (I think). I've included the main stylesheet if you're interested:

I tend to give a bit of a "pass" to anything published prior to 2012. In those days, the stuff we wanted to do, the stuff we COULD do, etc.--that was a whole other kettle of fish.

MOBI, back then (KF7, by and large) didn't even have more than 2 left-margin indents--to get more, you nested blockquotes, lol.
And yes, this is an ePUB discussion, but like most, we tried to have double-duty from our files.

So...while I may not like finding stuff like that, I try to forbear. After all, only the Gods know what people see when they see OUR stuff, now, 10-12 years later!

(I just suffered through a Berkeley, published less than 5 years ago, in a series of 13 or so books, that was forcibly left-justified/ragged-right. Couldn't override it. Suffice to say, I was NOT a happy camper. I know that you guys go in and clean yours, but I just don't have the calletas. We do this commercially. I have ZERO interest in then cleaning up something that I've bought to escape with, if you see what I mean....)

Hitch

[JSWolf]

Originally Posted by Turtle91

When you are more precise in the css you don’t need to have all of those repetitive classes for each paragraph within the specified div class. Your way has more bloat in the html to save a single line in the css.

How many other places are you going to use the .copy class in your ePub?

If you do the div with copy, there's still copy to be used with p and they are the same class. So I would need p.copy and div.copy for exactly the same thing when I could use .copy for both.

[Jellby]

Originally Posted by JSWolf

If you do the div with copy, there's still copy to be used with p and they are the same class. So I would need p.copy and div.copy for exactly the same thing when I could use .copy for both.

In that case, I'd change my selector to "div.copy, p.copy", to make it clear that it's a class intended for divs and ps. But hey, this is mostly a matter of taste and workflow.

[Turtle91]

Warning - channeling my inner Tex here

Originally Posted by JSWolf

If you do the div with copy, there's still copy to be used with p and they are the same class. So I would need p.copy and div.copy for exactly the same thing when I could use .copy for both.

I think that is where you are misunderstanding. You do NOT need to have p.copy and div.copy. The specificity rules, at least as far as I understand them, state that the more precise css takes priority.

for example:

p {margin:0; text-indent:1.2em; text-align:left}
   /* applies to ALL paragraphs */

div.copy {margin:2em 0 2em 1em} 
   /* applies to the div container */
div.copy p {text-indent:0 ; margin-top:.5em; font-family:Borkish}
   /* applies to all the paragraphs within the div.copy container 
 and has higher priority than any conflicting elements of the basic p tag */
div.copy p.signature {text-align:right} 
   /* applies to only the paragraphs within the div.copy container with a 
class="signature" and has higher priority than any conflicting elements of the basic 
p tag or p tags within the div.copy*/

*****

<div class="copy">
  <p>....</p>
  <p>....</p>
  <p>....</p>
</div>

will have the same styling as this ONLY if you have .copy css that covers the desired elements in both the <div> and <p>...to me that makes the css more convoluted.

<div class="copy">
  <p class="copy">....</p>
  <p class="copy">....</p>
  <p class="copy">....</p>
</div>

*****

I only need to have a class name for specific paragraphs that are different from the standard child paragraph style. My example ends up with much cleaner html and more logical/readable css.

I minimize using unspecific classes because there is a possibility of confusion when I'm looking at the html...

What styling should be applied with the following??:

.copy {yadda yadda}

<blockquote class="copy">
<div class="copy">
<p class="copy">
<table class="copy">
<ul class="copy">
<ol class="copy">
<sup class="copy">
<span class="copy">

Instead, with specific css, it is very clear exactly what styling goes with which tag, and I can use class names that make sense semantically:

HTML:

<div class="letter">
  <p>....</p>
  <p>....</p>
  <p class="signature">....</p>
</div>

<div class="email">
  <p>....</p>
  <p>....</p>
  <p class="signature">....</p>
</div>

<div class="journal">
  <p>....</p>
  <p>....</p>
  <p class="signature">....</p>
</div>

<div class="verse">
  <p>....</p>
  <p>....</p>
  <p class="signature">....</p>
</div>

CSS:

div.letter             {yadda yadda}
div.letter p           {yadda yadda}
div.letter p.signature {yadda yadda}

div.email             {yadda yadda}
div.email p           {yadda yadda}
div.email p.signature {yadda yadda}

div.journal             {yadda yadda}
div.journal p           {yadda yadda}
div.journal p.signature {yadda yadda}

div.verse             {yadda yadda}
div.verse p           {yadda yadda}
div.verse p.signature {yadda yadda}

Of course Jellby is correct in that it is a matter of taste and workflow...I was simply pointing out that you don't need to have all those redundant classes within a div.

This

<div class="copy">
  <p>....</p>
  <p>....</p>
  <p>....</p>
  <p>....</p>
  <p>....</p>
  <p>....</p>
</div>

is much cleaner than this

<p class="copy">....</p>
<p class="copy">....</p>
<p class="copy">....</p>
<p class="copy">....</p>
<p class="copy">....</p>
<p class="copy">....</p>

or this

<div class="copy">
  <p class="copy">....</p>
  <p class="copy">....</p>
  <p class="copy">....</p>
  <p class="copy">....</p>
  <p class="copy">....</p>
  <p class="copy">....</p>
</div>

[JSWolf]

Originally Posted by Turtle91

Warning - channeling my inner Tex here

Here is the code that works the best.

<div class="copy">
<p>Introduction copyright © 1989 Hui Corporation</p>
<p>Text copyright ©1956 Hui Corporation</p>
<p>Republished in 2012</p>
<p>All rights reserved.</p>
</div>

p {
  margin-top: 0;
  margin-bottom: 0;
  text-indent: 1.2em;
}
.copy {
  font-size: small;
  text-indent: 0;
  margin-top: 0.8em;
}
div.copy p {
  text-indent: 0;
}

[enuddleyarbl]

Just when I think I'm starting to get comfortable with this stuff.... I'm going to have to rethink what I'm doing with CSS in light of the above.

[Turtle91]

yup...what I said...lol

I still have the question: 'Where are you going to use class="copy" anywhere else in your epub other than in your <div class="copy">???'

You could certainly use the name somewhere else, but then the class name wouldn't make sense. So you could reduce your css a bit into:

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

div.copy p {
  text-indent: 0;
  font-size: small;
  margin-top: 0.8em;
}

[Turtle91]

Originally Posted by DaveLessnau

Just when I think I'm starting to get comfortable with this stuff.... I'm going to have to rethink what I'm doing with CSS in light of the above.

Please don't get overwhelmed by our little disagreements... it is mostly just minor differences in technique. Both will get you what you want and look the same way... my techniques just happen to be better in every way!

[enuddleyarbl]

You method is more than just a difference in technique. As you said a couple of posts up, with what you're doing, you get more semantically defined CSS. The HTML of the book is staying pretty generic, but the semantic aspect of the CSS lets the HTML behave differently based on what it is.

What I've been doing has been using a simple set of CSS that I change in the HTML depending on what I want the page to look like. Many of the published books I've been reformatting have HTML/CSS that looks like it was pushed out by and for a program simply because it's in their system and no human will ever see the underlying code. With the above, it looks like the HTML and CSS stays readable and understandable, but can be adapted to behave differently without too much trouble.

I'll have to play with this.