Mobileread
overriding someone else's css
#1  lumpynose 08-10-2019, 03:16 AM
I'm looking for feedback on my quick and dirty hack to override the css in downloaded books; removing fonts, "fixing" things like line height, justification, paragraph indentation, etc. I simply append it to the end of the existing css files. (I would use it as kobo_extra.css but the !important gizmo hoses things on the Kobo.)

Here's what I'm using so far. I'm wondering if you have other things you've needed or what your take is on this.

PHP Code
body {
    
background-colorinitial !important;
    
font-family: unset !important;
    
line-height1.2 !important;
}

{
    
font-family: unset !important/* MS Word stuff */
    
line-height1.2 !important;
    
margin0em !important;
    
text-alignleft !important;
    
text-indent!important;
}

{
    
text-indent1.6em !important;

Reply 

#2  GeoffR 08-10-2019, 05:24 AM
That will really mess up books where the publisher uses <p> for headings etc., and won't have much effect on books where the publish

Edit: One specific problem likely to be caused by margin: 0em !important; is the loss of scene breaks of the sort where the new scene is indicated by a top margin on the opening paragraph.

Edit: My experience is that each ebook is constructed differently, there is nothing even close to a standard even with books produced by the same publisher, and so any attempt to apply a one-size-fits-all algorithm is a waste of time. I just edit each one manually, and if that sounds like a lot of work then think of it in terms of the time spent reading the book: a few minutes editing (for 98% of books, a small minority take longer) vs. many hours reading and re-reading.
Reply 

#3  lumpynose 08-10-2019, 12:09 PM
Quote GeoffR
Edit: My experience is that each ebook is constructed differently, there is nothing even close to a standard even with books produced by the same publisher, and so any attempt to apply a one-size-fits-all algorithm is a waste of time. I just edit each one manually, and if that sounds like a lot of work then think of it in terms of the time spent reading the book: a few minutes editing (for 98% of books, a small minority take longer) vs. many hours reading and re-reading.
I agree, but so far it's fixing a large majority of the books and thus saving me the effort of eyeballing and analyzing the css.
Reply 

#4  stumped 08-10-2019, 01:02 PM
Rather than over ride I remove the worst offenders.
After importing any book
I do an epub to epub conversion in calibre with filters set to e.g. strip out all line heights.
those were my pet peeve, seeing lines too close together..

I do add widows , Orphans 1 as extra css.
But this is just for personal reading. I don't need to please anyone except me.

I like a line spacing of 1.9, no dropcaps, no hyphens, no silly fonts, no short pages due to widows...
Reply 

#5  Turtle91 08-10-2019, 04:13 PM
Just appending CSS at the bottom will work with those devices apps that don't ignore the publisher's CSS in the first place. However, this technique could slow down the reading process as the device has to figure out how to render the page, then re-figure it out, then re-figure, etc. depending on how many conflicting styles are on the css sheet. Obviously this is a greater problem on older, slower, devices.
Reply 

#6  GeoffR 08-10-2019, 11:19 PM
Quote stumped
Rather than over ride I remove the worst offenders.
That is the approach I take too, but I am selective in what I remove, I check each case to see what it is being used for before removing it.

E.g. I don't remove all line-height styles, I only remove the ones that affect the main body text. Sometimes a specific line-height is necessary and removing it would spoil the layout, such as a reduced or zero line height used to prevent a raise-cap from increasing the space between the first and second line of the opening paragraph.

Edit: Another example from the OP: text-align: left !important; will (on some ereaders) force all paragraphs to be left-aligned. Better to just remove the instances of text-align:justify; and leave text-align:center; and text-align:right; intact.
Reply 

#7  lumpynose 08-11-2019, 12:52 AM
Quote GeoffR
Edit: Another example from the OP: text-align: left !important; will (on some ereaders) force all paragraphs to be left-aligned. Better to just remove the instances of text-align:justify; and leave text-align:center; and text-align:right; intact.
I wonder if changing it from just "p" to "body p" would help with that? Bandaids on top of bandaids.
Reply 

#8  stumped 08-11-2019, 01:10 AM
if the edits are for books you intend to sell or distribute, please don't specify line heights

That stops the on-device sliders working on kobo readers, and stops some apps from applying defined themes e.g. mantano/Bookari

the reason I originally had to figure out how to strip all height 1.2 stuff was because it looked so awful on my tablets in Montano and it blocked Montano from applying my set preference

similarly with fonts. if you include declarations like font: serif or font: times... in CSS ,that messes with some apps/readers applying the font that the reader wants to see

and with justification - you yourself may prefer "left" , I and other readers may hate it and want " justified"

leave it out - let the readers device/app manage it
Reply 

#9  GeoffR 08-11-2019, 02:38 AM
Quote stumped
if the edits are for books you intend to sell or distribute, please don't specify line heights

That stops the on-device sliders working on kobo readers, and stops some apps from applying defined themes e.g. mantano/Bookari
I think that is overstating the situation. I would encourage publishers to use line-height in those situations where it improves the book, as long as it doesn't prevent the reader from adjusting line spacing for the main text of the book.

line-height can be used in a way that doesn't interfere with the device's ability to adjust the line spacing. For example you can use a specific line spacing on the title page and that won't intefere with the rest of the book. Or you can set the line-height at the span level without interering with the device's ability to adjust the line spacing of the paragraph, such as for raise-caps:
Code
<p style="text-indent:0;padding-top:1em;"> <span style="line-height:0;font-size:2em;">T</span>his use of line-height avoids the extra space between the first and second lines of this pararaph, caused by the 2em raise-cap (on devices which honour the style), but doesn't prevent the device from adjusting the line spacing of the paragraph.</p>
Reply 

#10  GeoffR 08-11-2019, 03:04 AM
Quote lumpynose
I wonder if changing it from just "p" to "body p" would help with that? Bandaids on top of bandaids.
I can't see how that would help. What you can achieve with CSS overrides is extremely limited. I don't know any way to selectively override text-align:justify; without also overriding text-align:center; (assuming that is what you are aiming for) if you restrict yourself to CSS overrides.
Reply 

  Next »  Last »  (1/3)
Today's Posts | Search this Thread | Login | Register