![]() |
#1 |
Running with scissors
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 1,584
Karma: 14328510
Join Date: Nov 2019
Device: none
|
html tags always have a class?
When I edit books that I buy or download from Project Gutenberg they always have classes on almost every html tag. For example, every p tag has the class pindent or some such.
Then the CSS will have something like ".pindent { text-indent ...}". When I'm fixing a book, in the CSS I'll just have a plain p with the necessary formatting; "p { text-indent: ...}" Is there some reason, for compatibility, safety, etc. for them doing that? |
![]() |
![]() |
![]() |
#2 |
A Hairy Wizard
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 3,345
Karma: 20171571
Join Date: Dec 2012
Location: Charleston, SC today
Device: iPhone 15/11/X/6/iPad 1,2,Air & Air Pro/Surface Pro/Kindle PW & Fire
|
They probably had some template somewhere...or that's how they were told to do it... or they had some automated software that did it that way and they didn't know any better. There is no requirement to have them.
It ultimately boils down to technique, but having extra code bloat causes the renderer to have to decode all that extra styling. This slows down the display of your book (much more noticeable on older devices) and could ultimately cause the book to be unreadable. I always remove those unnecessary classes. I've seen some ridiculous tags like: <p class="para"> <i class="italic"> <b class="bold"> For a nice 'clean' code, I define the standard styling, then only add classes to those special situations where they are different than the standard. eg: Code:
CSS p {margin:0; text-indent:1.2em} p.banner {margin:2em 0; text-indent:0; text-align:center; font-weight:bold} HTML <p>Standard paragraph.</p> <p>Standard paragraph.</p> <p>Standard paragraph.</p> <p>Standard paragraph.</p> <p class="banner">Paragraph with special formatting.</p> <p>Standard paragraph.</p> <p>Standard paragraph.</p> <p>Standard paragraph.</p> <p>Standard paragraph.</p> |
![]() |
![]() |
Advert | |
|
![]() |
#3 |
Running with scissors
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 1,584
Karma: 14328510
Join Date: Nov 2019
Device: none
|
Thanks. That's what I do as well. I also use combinators to keep the html clean; hopefully the ereaders can handle those. E.g., "p { text-indent: 1.5em; } h2 + p { text-indent: 0; }"
|
![]() |
![]() |
![]() |
#4 | |
A Hairy Wizard
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 3,345
Karma: 20171571
Join Date: Dec 2012
Location: Charleston, SC today
Device: iPhone 15/11/X/6/iPad 1,2,Air & Air Pro/Surface Pro/Kindle PW & Fire
|
Quote:
Cheers, |
|
![]() |
![]() |
![]() |
#5 | |
Resident Curmudgeon
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 79,615
Karma: 145864263
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Quote:
There is no reason they cannout use <p> for the most use paragraph format. p { margin-top: 0; margin-bottom: 0; text-indent: 1.2; } That works very well and it's what I use for <p>. |
|
![]() |
![]() |
Advert | |
|
![]() |
|
![]() |
||||
Thread | Thread Starter | Forum | Replies | Last Post |
Epub->htmlz: Add <p> tags as <div class="Para"> children | ranvel | Conversion | 11 | 07-21-2019 11:06 PM |
HTML to epub disable class change | chittu | Calibre | 1 | 12-25-2013 01:33 PM |
Help me with some concepts with tags/class for epub | FatDog | ePub | 9 | 06-18-2012 02:46 PM |
HTML input plugin stripping text within toc tags in child html file | nimblebooks | Conversion | 3 | 02-21-2012 03:24 PM |
Problem with html -> Mobi conversion - html tags visible. | khromov | Calibre | 9 | 08-06-2011 11:25 AM |