Extra white space after non-breaking hyphens on the Kobo build #801
Description
Symptom
When the kepub (se) build is viewed on a kobo device, there's extra white space included after a word containing non-breaking hyphens.
The same issue is not observed on the epub build or the kepub build created using kepubify.
Correct:
Incorrect:
Complete test case available on this branch: https://github.com/Kos/jules-verne_robur-the-conqueror/tree/whitespace-rendering-test
XHTML differences
Example line in source and epub:
<p>And the inexplicable <i>f‑r‑r‑r‑r</i> seemed to sweep along below it.</p>The same line in kepub (se):
<p><span id="kobo.12.1" class="koboSpan">And the inexplicable </span><i><span id="kobo.12.2" class="koboSpan">f-r-r-r-r</span></i><span id="kobo.13.1" class="koboSpan"> seemed to sweep along below it.</span></p>The same line in kepub (kepubify):
<p><span class="koboSpan" id="kobo.5.1">And the inexplicable </span><i><span class="koboSpan" id="kobo.5.2">f‑r‑r‑r‑r</span></i><span class="koboSpan" id="kobo.5.3"> seemed to sweep along below it.</span></p>The changes seem structurally the same; only numerical IDs are different.
CSS differences
core.css has some ines removed in kepub (se):
--- "test case.epub.d/epub/css/core.css" 2025-03-08 16:00:02.000000000 +0100
+++ "test case.kepub.epub.d/epub/css/core.css" 2025-03-08 16:00:02.000000000 +0100
@@ -4,9 +4,6 @@
body{
font-variant-numeric: oldstyle-nums;
hyphens: auto;
- adobe-hyphenate: auto;
- -webkit-hyphens: auto;
- -moz-hyphens: auto;
-epub-hyphens: auto;
text-wrap: pretty;
}
@@ -55,10 +52,6 @@
page-break-inside: avoid;
font-variant: small-caps;
hyphens: none;
- adobe-text-layout: optimizeSpeed; /* For Nook */
- adobe-hyphenate: none;
- -webkit-hyphens: none;
- -moz-hyphens: none;
-epub-hyphens: none;
margin-top: 3em;
margin-right: 0;
@@ -168,10 +161,6 @@
break-inside: avoid;
page-break-inside: avoid;
hyphens: none;
- adobe-text-layout: optimizeSpeed; /* For Nook */
- adobe-hyphenate: none;
- -webkit-hyphens: none;
- -moz-hyphens: none;
-epub-hyphens: none;
text-align: center;
}core.css is unchanged in kepubify.
se.css has some adjustments in kepub (se):
--- "test case.epub.d/epub/css/se.css" 2025-03-08 16:00:02.000000000 +0100
+++ "test case.kepub.epub.d/epub/css/se.css" 2025-03-08 16:00:02.000000000 +0100
@@ -73,10 +73,6 @@
section.epub-type-imprint a,
section.epub-type-colophon a{
hyphens: none;
- adobe-text-layout: optimizeSpeed; /* For Nook */
- adobe-hyphenate: none;
- -webkit-hyphens: none;
- -moz-hyphens: none;
-epub-hyphens: none;
}
@@ -94,7 +90,7 @@
text-indent: 0;
}
-section.epub-type-copyright-page blockquote p span{
+section.epub-type-copyright-page blockquote p span.se{
display: block;
padding-left: 1em;
text-indent: -1em;
@@ -102,4 +98,13 @@
section.epub-type-copyright-page blockquote br{
display: none;
-}
\ No newline at end of file
+}
+
+/* Kobo compatibility CSS */
+
+section[epub|type~="titlepage"] h1,
+section[epub|type~="titlepage"] p,
+section[epub|type~="colophon"] h2,
+section[epub|type~="imprint"] h2{
+ font-size: 0; /* Required for Kobo not to add an extra page to the title */
+}se.css is again unchanged in kepubify.
testcase.xhtml has some css added by kepubify, but it looks irrelevant:
--- "test case.epub.d/epub/text/testcase.xhtml" 2025-03-08 16:00:02.000000000 +0100
+++ "test case_kepubify.kepub.epub.d/epub/text/testcase.xhtml" 2025-03-08 17:00:02.000000000 +0100
@@ -1,30 +1,29 @@
-<?xml version="1.0" encoding="utf-8"?>
-<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" lang="en-US" epub:prefix="z3998: http://www.daisy.org/z3998/2012/vocab/structure/, se: https://standardebooks.org/vocab/1.0" xml:lang="en-US">
- <head>
+<?xml version="1.0" encoding="utf-8"?><html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" lang="en-US" epub:prefix="z3998: http://www.daisy.org/z3998/2012/vocab/structure/, se: https://standardebooks.org/vocab/1.0" xml:lang="en-US"><head>
<title>Chapter</title>
<link href="../css/core.css" rel="stylesheet" type="text/css"/>
<link href="../css/local.css" rel="stylesheet" type="text/css"/>
- </head>
- <body epub:type="bodymatter z3998:fiction">
+ <style type="text/css" class="kobostylehacks">div#book-inner { margin-top: 0; margin-bottom: 0;}</style></head>
+ <body epub:type="bodymatter z3998:fiction"><div id="book-columns"><div id="book-inner">
<section id="chapter-6" role="doc-chapter" epub:type="chapter">