I have a page with a structure similar to this:
<main>
<section>
<article></article>
<aside></aside>
</section>
</main>
In the CSS, I include the following:
main {
display: flex;
flex-direction: row;
}
The article is often many pages long.
When I print or print preview, I find that it only gives me the first page or so. After some experimenting, I have got this solution:
@media print {
aside {
display: none;
}
main {
display: block;
}
}
That is, by using display: block
I can get all of the pages to print again. In this case, it’s OK, as I don’t want the aside
to print, so I don’t need the flex
behaviour, but that’s not always the case.
It seems to work well on Safari and Chrome. I am testing this on a Mac.
Why doesn’t this work on Firefox?
The actual page can be found at: https://www.internotes.net/articles/toggling-attributes. It’s still in its early stages.