Print CSS only showing the first page

Hello, I am trying to write some SCSS for printing the screen in A4 landscape that retains a lot of the on screen styles. I kind of have this working with the following SCSS. However, whilst print preview shows there are 20+ pages, the first page is just repeated over and over. i.e. page two is never shown. I'm afraid I can not attached the pdf as it contains commercially sensitive information, I hoping the above explains the situation sufficiently. Here is my current SCSS.
@media print {
@import './table.scss';

@page {
size: A4 landscape;
-webkit-print-color-adjust: exact;
}

* {
visibility: hidden;
margin: 0;
padding: 0;
-webkit-print-color-adjust: exact;
font-size: 10pt !important;
}

#comparetray * {
visibility: visible;

.headers,
.navigation,
button.close {
display: none !important;
}
}
}
@media print {
@import './table.scss';

@page {
size: A4 landscape;
-webkit-print-color-adjust: exact;
}

* {
visibility: hidden;
margin: 0;
padding: 0;
-webkit-print-color-adjust: exact;
font-size: 10pt !important;
}

#comparetray * {
visibility: visible;

.headers,
.navigation,
button.close {
display: none !important;
}
}
}
1 Reply
Grant
Grant16mo ago
I should add, I have checked print settings