danielweck
commented
10 years ago I am able to reproduce this (Chrome OSX, Readium "cloud reader" and Chrome extension).
In my test case, each column is one pixel wider than it should be. This imprecision accumulates to several pixels by the time Readium "scrolls" to the correct column (HTML left relative positioning).
This is a browser issue, I am not sure how we can solve it. A possible workaround would be to assume a larger column width by default ("rounding up"), but this would have an adverse effect when scrolling to columns that have the correct size!
I also noticed that the "pre" code fragments are truncated as they overflow pass the column boundary. Again, I don't think we can do much to fix this, unless we stop using CSS columns to emulate pagination (which would be good, as there are other problems with columnization, such as unplayable videos in WebViews! Unfortunately, the "proper" W3C pagination feature isn't widely supported, and it has its own caveats anyway). I'm keeping this issue open, but with low priority.
jccr
Originally posted by @edas at https://github.com/readium/readium-js/issues/49
See screenshot (in the right page : lack of a few characters on end of line, and lack of the blue right border of the "note"). Both reproduceable in Firefox and Chrome, both in master and in develop branches. This example is with the file "accessible epub 3" from readium-js-viewer.
When resizing little step per little step, it is easy to find a step where the second column is truncated of a few pixels.
In my example, here a few metrics :
reflowable-content-frame (
<div>surrounding the<iframe>) is of 766.5 pixelsThe total (2 columns + gap) should fit in the iframe, but does not.
<p>in the columns have 353.5px (and not 353px) however there are more than 1 pixel missing at right so I doubt this rounding error is the root problem.However, the
<aside>surrounded by a blue border has 335.5px widht + 2_8px padding + 2_1px border. This may have to be investigated as a potential cause of the problem.