I need to see exactly where the browser puts page breaks in the preview so that I can change this behavior using CSS properties. In other words, I need to style the page break myself (for testing purposes, of course) so that I can see where the page break will occur, so that I know which selectors need to be changed using the page-break-after / inside / before properties.
To clarify this, I am NOT looking for Chrome Dev Tools print emulation. This tool, unfortunately, does not show how the page will look when printed (anyone can compare its results with the results in the print preview window accessed by CTRL P in Chrome or any other browser). However, this tool can be useful when you need to find out if some of your CSS print rules override a specific screen rule or not. But it doesn’t help much in situations like this, when you need to determine the exact position of the page breaks displayed by the browser in order to manually change the behavior of the page breaks.
source share