How to make Kobo's Kepub renderer do its job?

[doubleshuffle]

I normally stay away from kepubs, mainly because I don't like the mandatory header and detest those silly reading stats.

But now I have been forced to tinker with the format a little bit because it doesn't fail in one little detail where Kobo's standard epub renderer does. But the kepub renderer fall short in so many other ways:

It ignores
- "text-decoration: none" for links and underlines them anyway,
- "text-align: center" and
- "page-break-before:always" are both blithely ignored as well.

All three of the above work perfectly fine on the standard epub renderer, as well as in ADE and both Sigil's and Calibre's previews. They fail in the kepub renderer, no matter if I just change the file extension or run the file through Calibre's epub > kepub conversion plugin.

I must be doing something wrong; can't believe the renderer is that bad...

[Terisa de morgan]

Where do you find that "text-align: center" doesn't work. All my headers have that justification, and they are centered (probing that I don't fix the alignment at the ereader options).

[doubleshuffle]

Originally Posted by Terisa de morgan

Where do you find that "text-align: center" doesn't work. All my headers have that justification, and they are centered (probing that I don't fix the alignment at the ereader options).

True, the headers have it. Seems to be the default there. All the other centered elements show as left-aligned, though.

And thanks for reminding me of the headers: The font I've embedded for them isn't displayed either.

[Terisa de morgan]

Originally Posted by doubleshuffle

True, the headers have it. Seems to be the default there. All the other centered elements show as left-aligned, though.

And thanks for reminding me of the headers: The font I've embedded for them isn't displayed either.

No, I have centered elements aside of the headers (separator, for example) and they appear as I define them. I think it's something at the settngs.

[doubleshuffle]

Originally Posted by Terisa de morgan

No, I have centered elements aside of the headers (separator, for example) and they appear as I define them. I think it's something at the settngs.

It probably is, but I'm wondering where. I've done dozens of books with these settings, and they work everywhere except with the kepub renderer. One example:

CSS:

div.prose > p.center {text-align:center; text-indent:0}

Html file:

<div class="prose">
    <p class="center">[1932]</p>
  </div>

is displayed left-aligned.

[jackie_w]

@doubleshuffle,

I think your problem with 'lost text-aligns' is because the kepub renderer enforces overriding CSS for <div> and <p> elements. By default it has the following sledgehammer applied:

div, p { text-align: %1 !important; }

where %1 is your Justification setting in the Kobo's Aa menu screen.

If you're already using the Kobo Patcher for other tweaks you should try enabling the patch labeled

patch_name = `Un-Force user text-align in div,p tags in KePubs`

The patch changes the override to

body   { text-align: %1 !important; }

which matches the override for standard epubs.

[doubleshuffle]

Well, that's a sledgehammer indeed.

Thanks a lot. Very helpful reply!

I do patch my Kobo, I've just never bothered with the kepub patches. Seems I'll have to now.

Or I'll use the quick and dirty fix for my little problem that caused me to try kepub, and keep on keeping away from that format. Sheesh, seeing my styles so awfully ignored felt like trying out FB-Reader years ago...

[dgatwood]

No need to patch things. Just change your stylesheet slightly.

The !important in the Kobo rule is evil for a built-in rule, because it overrides anything that isn't similarly marked !important. However, if you add !important to your stylesheet, specificity rules come back into play.

In other words:

div.prose > p.center {text-align:center !important; text-indent:0 !important;}

That will have greater specificity, and thus should override the built-in stylesheet.

[JSWolf]

Originally Posted by doubleshuffle

I normally stay away from kepubs, mainly because I don't like the mandatory header and detest those silly reading stats.

But now I have been forced to tinker with the format a little bit because it doesn't fail in one little detail where Kobo's standard epub renderer does. But the kepub renderer fall short in so many other ways:

What's the problem with RMDSK?

[doubleshuffle]

Originally Posted by dgatwood

No need to patch things. Just change your stylesheet slightly.

The !important in the Kobo rule is evil for a built-in rule, because it overrides anything that isn't similarly marked !important. However, if you add !important to your stylesheet, specificity rules come back into play.

In other words:

div.prose > p.center {text-align:center !important; text-indent:0 !important;}

That will have greater specificity, and thus should override the built-in stylesheet.

Thanks. I'll try that.

Originally Posted by JSWolf

What's the problem with RMDSK?

RMSDK on Kobo doesn't display right-to-left text correctly. See here.

[JSWolf]

Originally Posted by doubleshuffle

RMSDK on Kobo doesn't display right-to-left text correctly. See here.

That's because ADE is mostly an ePub 2 renderer. I think it's some version 3 RMDSK being used. Does ADE 3.x handle right-to-left text? Does version 4.x? If 4.x does and 3.x does not, it's because Kobo is not using the current RMDSK.

[Hitch]

Originally Posted by doubleshuffle

Well, that's a sledgehammer indeed.

Thanks a lot. Very helpful reply!

I do patch my Kobo, I've just never bothered with the kepub patches. Seems I'll have to now.

Or I'll use the quick and dirty fix for my little problem that caused me to try kepub, and keep on keeping away from that format. Sheesh, seeing my styles so awfully ignored felt like trying out FB-Reader years ago...

Dubbs! I wish I had any type of answer for you, but I don't. I have a client who is suffering the slings and arrows of Kepubbing, but not with the actual ePUB, as it is delivered--with the bloody previewer! The horror story I have on THAT one...

Originally Posted by dgatwood

No need to patch things. Just change your stylesheet slightly.

The !important in the Kobo rule is evil for a built-in rule, because it overrides anything that isn't similarly marked !important. However, if you add !important to your stylesheet, specificity rules come back into play.

In other words:

div.prose > p.center {text-align:center !important; text-indent:0 !important;}

That will have greater specificity, and thus should override the built-in stylesheet.

@Dag:

Have you had any success with the !important modifier vis-a-vis the Previewer, at Kobo's website?

I have a client that paid some damn good money, for a rather complex ebook (exercises...you know). We did said book. After a lot of blood, pain and suffering, the book met with her approval. (And, thank you, sweet Baby Jesus...).

But, alas, the bloody book seems to have MIA top-margins (or bottom. At this point, I no longer remember). So, after us tweaking the thing more than a few times, to no avail, she complains to Kobo Support. She's not a bad client--I mean, she's not bitching AT me, she's asking for our help. Just wanna be clear about that.

So, her and Kobo: Back-forth, back-forth, yadda. Finally, one of their "techs" FIXES <> the ePUB. Right? Everything's all fine?

I review the "fixed" ePUB, and whichever way it was ignoring, the Tech swapped out top-margin for bottom on the preceding element. Fine. Whatever, at this point.

But, lo: the "fixed" ePUB doesn't work, EITHER. Not in the Preview. Vertical whitespace between things like a set of images and the destructions for that exercise are collapsed. To me, the book doesn't look godawful (and I'm picky), but not as "great" as it looked when done. Nonetheless, the point here is: apparently, their own damn techs can't make KEPUB work, EITHER.

Have you had any success taming kePUB's preview, Dag? Or are you saved from that indignity? I'd like to assist this client if I can. The "expert" tech used the important modifier, which seemed to do absolutely zippo, zilch, nein, nada.

Spoiler:

Non sequitur: am I the Lone Ranger here in hating the !important; modifier?

Hitch

[Toxaris]

Originally Posted by Hitch

Spoiler:

Non sequitur: am I the Lone Ranger here in hating the !important; modifier?

Hitch

No! I absolutely hate it. It should not be necessary at all. A reader should behave and use the stylesheet as delivered by default. If you want to enable all kind of changes in your reader (like font-size), fine. Then overrule the stylesheet. But the stylesheet should be the primary layout source.

[Hitch]

Originally Posted by Toxaris

No! I absolutely hate it. It should not be necessary at all. A reader should behave and use the stylesheet as delivered by default. If you want to enable all kind of changes in your reader (like font-size), fine. Then overrule the stylesheet. But the stylesheet should be the primary layout source.

I agree. There's a guy at the KDP forums who is all over the important modifier. He claims it fixes everything this side of old age and wrinkles. I'd starting going down the road of getting into a pissing match with him...and then decided screw it, it's not worth it. Tex saw that thread. (Don't get me started on how he blithely tells them all NOT TO USE heading classes for headings, but to use paragraph classes, grrrrrrrrrrrrrrr.)

Anyway, I was wondering if I was being old and cranky (forebear from the obvious comeback on this, gang) in particular about this topic. My gang of merry bookmakers knows that I want them to try EVERYTHING other than important...and if you ask me why, I'm not sure I have a great answer, other than...seems like a cop-out shortcut. {shrug}

Hitch

[dgatwood]

Originally Posted by Hitch

Have you had any success with the !important modifier vis-a-vis the Previewer, at Kobo's website?

I haven't tried it for that issue. I'm just giving general comments based on the CSS spec.

Again, though, be aware that it isn't necessarily sufficient to just add !important. You also have to add additional elements and/or classes to the rule until you've raised its specificity above the built-in rule's specificity. That's the bit that many attempts at overriding evil stylesheets often miss.

Something else that can often bite you (particularly in iBooks' built-in stylesheets) is the universal selector (*), because it means that for some styles, you might need to do things like:

p.whatever {style_rule_here !important; }
p.whatever * {style_rule_here !important; }

depending on the style rule and whether it needs to cascade to elements inside a tag. I have no idea if Kobo is doing anything similar.

The one that got me was that Kobo reader (at least I think it was Kobo) had a bug where if you reduced the left an right margins to zero, you'd get parts of one page on the previous page. I think I filed a bug about that, and they fixed it in a subsequent release. That said, I might be remembering some other reader. They all run together after a while.