A few grideas

Because, well, ebook pagination has been fake news from the start.

What if…

display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-areas:
    "figure figure"
    "page-left page-right";

and…

display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-areas:
    "figure page-right";

and…

display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-areas:
    "page-left page-right"
    "footnote footnote";

and finally…

The more I’m playing with the CSS specs the cool kids promote and demo right now—flexbox, grid, viewport units and so on and so forth—, the more Reading Systems fail at managing them properly.

Grid is completely fucked up in CSS3 columns. As for flex, it looks like there’s no way to prevent images and (sometimes) text being cut off.

Now, those specs solve a lot of issues, including responsiveness, and since EPUB is not just about books—drink!—, contents could benefit from them.

So maybe it’s time for a reset or, at least, some experiments to bring hope back to bold and beautiful.

Super quick and dirty demo

¯\_(ツ)_/¯