09-30-2013, 07:26 AM | #1 |
Junior Member
Posts: 4
Karma: 10
Join Date: Jul 2013
Device: Kindle Fire 8.4.3, iPad3
|
EPUB 3 multi column text reading order across pages for epub
Hi all
I am creating multi column epub3 free-layout. My multicolumn div running text across multiple pages, it works fine. My problem column reading order, the column 1 text flows across 4 pages then then second column starts in 1st page. The wrong reading order i am getting now in IPad I-books Page 1 text flow point 1 text flow point 7 text flow point 2 text flow point 7 text flow point 3 text flow point 8 Page 2 text flow point 3 text flow point 9 text flow point 4 text flow point 10 text flow point 5 text flow point 11 Page 3 text flow point 6 text flow point 12 text flow point 7 text flow point 13 Can anyone know how to fix this issue Thanks in advance |
10-01-2013, 12:21 AM | #2 |
Addict
Posts: 243
Karma: 359054
Join Date: Nov 2012
Device: default
|
What should it look like?
Can you post the html/css - it would be easier than trying to guess the result your are trying to achieve. |
Advert | |
|
10-01-2013, 03:51 AM | #3 |
Junior Member
Posts: 4
Karma: 10
Join Date: Jul 2013
Device: Kindle Fire 8.4.3, iPad3
|
hi Thanks,
Please see the screenshot, where you can find the content sequence is flow into next page and not within the page. Also attached CSS/html coding for reference. THanks in advance. Sathish test_copy.epub |
10-01-2013, 08:07 AM | #4 | |
Wizard
Posts: 1,580
Karma: 7043711
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
|
Quote:
Hi laksathish; The problem with your design is that you don't have set a "height" for the page Since you use inline styles, do the following: 1. Open your test_copy.epub in Sigil 2. Select the text.xhtml page 3. Active the "code view" mode 4. Replace the tag Code:
<html xmlns="http://www.w3.org/1999/xhtml"> Code:
<html xmlns="http://www.w3.org/1999/xhtml" style="height: 500px"> Code:
<body style="height: 500px"> Code:
div.mcol { height: 500px; -webkit-column-count: 2; -webkit-column-width: 45%; -webkit-column-gap: 10%; } Try this code and tell us your results. Regards Rubén EDIT: Also you can use the property "-webkit-column-break-after: avoid;" with "h" tags to maintain headers together with the text below. Last edited by RbnJrg; 10-03-2013 at 11:41 AM. |
|
10-01-2013, 09:14 AM | #5 |
Junior Member
Posts: 4
Karma: 10
Join Date: Jul 2013
Device: Kindle Fire 8.4.3, iPad3
|
hi,
Thanks, actually it is working fine in any browser or sigil, but not displaying in iPad as showing in the browser view. Could some one help me on this with your experience. Thanks, Sathish |
Advert | |
|
10-03-2013, 11:45 AM | #6 | |
Wizard
Posts: 1,580
Karma: 7043711
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
|
Quote:
Please, try the new "test_copy.epub" I have uploaded in my previous post. I edited it and now is correct; maybe this time things can work (let's hope so ) |
|
10-04-2013, 12:19 PM | #7 | |
Enthusiast
Posts: 47
Karma: 18498
Join Date: Jul 2009
Location: France
Device: PRS-650
|
Quote:
For EPUB 3 the correct way is to use the CSS 3 properties column-count, column-width, etc. Also you can use either column-count or column-width, the first one if you want a fixed number of columns no matter the size of the screen/window and the second one (without column-count) if you want the number to vary and fit the width of the screen, but its value should be in em or ex rather than %. The second one is better if you want your epub to remain readable on small readers Last edited by Syniurge; 10-04-2013 at 12:22 PM. |
|
10-04-2013, 02:07 PM | #8 |
Wizard
Posts: 1,580
Karma: 7043711
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
|
|
11-24-2016, 03:43 PM | #9 |
Groupie
Posts: 171
Karma: 158116
Join Date: Oct 2015
Device: Kobo Glo HD (landscape), Kobo Aura One
|
I face same issue i.e. columns are continue on next page instead of break. Also the "test_copy.epub" show same result as in the screen from Satish but to be honest I am using Kobo Aura One.
At the end I like to see two columns vertical page by page. Currently the columns either flow to next page or too many columns side by side which leads into loosing text. I have no clue about CSS. But after reading a lot in this forum I put additional CSS information in Calibre as follows: p,div,span,body{margin: 0;} p,div,span,body{-epub-writing-mode: vertical-rl;} body{height: 1400px; width: 1000px; -webkit-column-count: 2; -webkit-column-width: 45%;-webkit-column-gap: 10%;} - vertical without columns is perfect - columns with or without vertical are not proper |
11-25-2016, 03:22 AM | #10 |
Fanatic
Posts: 556
Karma: 400004
Join Date: Feb 2009
Device: ONYX M96
|
I made some test, some times ago, and I see the e-reader APP support for columns in multiple pages and reflow is bad, bad, bad.
|
11-25-2016, 05:27 AM | #11 | |
Wizard
Posts: 1,580
Karma: 7043711
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
|
Quote:
|
|
11-25-2016, 07:02 AM | #12 |
Grand Sorcerer
Posts: 24,905
Karma: 47303822
Join Date: Jul 2011
Location: Sydney, Australia
Device: Kobo:Touch,Glo, AuraH2O, GloHD,AuraONE, ClaraHD, Libra H2O; tolinoepos
|
|
11-25-2016, 12:18 PM | #13 |
Groupie
Posts: 171
Karma: 158116
Join Date: Oct 2015
Device: Kobo Glo HD (landscape), Kobo Aura One
|
Sorry to miss to mention that.
On calibre I use additionl css and convert to epub. But while sending they are changed i.e. on my kobo are kepub.epub. |
11-13-2018, 05:18 AM | #14 |
Junior Member
Posts: 4
Karma: 10
Join Date: Feb 2016
Device: Kobo glo hd
|
How can this be made functional on the kobo glo?
|
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
Multi-Column Reading on Kindle DX? | ppk812 | Kindle Developer's Corner | 5 | 01-11-2013 05:39 PM |
Convert PDF to EPub or LRF puts pages out of order | Timber | Conversion | 3 | 12-29-2011 06:57 AM |
Multi-level TOC broken in epub->epub conversion | siebert | Conversion | 14 | 03-09-2011 05:38 PM |
Troubleshooting Reading PDFs with column text on Kindle | DaAfroSheenQueen | Amazon Kindle | 3 | 12-10-2010 12:24 PM |
New hack PRS-505: multi status line with %read, time&pages reading, pages per minute. | Car105 | Sony Reader Dev Corner | 5 | 01-03-2010 10:03 AM |