Sigh, do I have to spell everything out in baby language?
You have #container set to a width of 500px and have its overflow set to hidden.
In paged mode, the content is laid out horizontally instead of vertically (using the CSS3 columns module). That makes it wider than 500px, therefore it gets hidden.
Change that overflow to visible and it will work, regardless of position:relative.
Setting a container to a fixed width with overflow hidden is an example of a non-reflowable layout -- since it prevents the content of the container from being reflowed horizontally.
I assume the Kindle and Nook viewers use a different strategy to break up an html document into pages, therefore they dont show this problem. They will however, show other problems, for other classes of non-reflowable markup.
|