As I understand it, these two values during printing make it so that after a page break, the next paragraph is set on the left page or right (if the text is arranged like a book when printed), but this does not happen.
It is written that the browser can perceive the values of "left" and "right" as "always" values: if so, why do we need these two values ??
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>hayti</title>
<style>
@media print {
p {
page-break-after: left;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur nunc enim, convallis quis purus ut, congue ultricies eros. Vestibulum sit amet lacus maximus, finibus enim nec, gravida felis. Vestibulum pharetra neque sed lorem vestibulum vestibulum. Aenean ornare malesuada varius. Vestibulum hendrerit egestas enim sit amet maximus. Cras ligula lectus, ullamcorper quis turpis id, blandit convallis purus. Integer pulvinar diam sed cursus condimentum. Aenean a pulvinar felis. Ut pellentesque nec diam a malesuada. Nullam dolor felis, iaculis id odio vel, fringilla lacinia magna. Interdum et malesuada fames ac ante ipsum primis in faucibus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent nec risus augue. Etiam consequat, mi id dictum tincidunt, nunc diam vehicula neque, vitae interdum sapien elit vel erat. Etiam vulputate turpis eget est molestie malesuada.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur nunc enim, convallis quis purus ut, congue ultricies eros. Vestibulum sit amet lacus maximus, finibus enim nec, gravida felis. Vestibulum pharetra neque sed lorem vestibulum vestibulum. Aenean ornare malesuada varius. Vestibulum hendrerit egestas enim sit amet maximus. Cras ligula lectus, ullamcorper quis turpis id, blandit convallis purus. Integer pulvinar diam sed cursus condimentum. Aenean a pulvinar felis. Ut pellentesque nec diam a malesuada. Nullam dolor felis, iaculis id odio vel, fringilla lacinia magna. Interdum et malesuada fames ac ante ipsum primis in faucibus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent nec risus augue. Etiam consequat, mi id dictum tincidunt, nunc diam vehicula neque, vitae interdum sapien elit vel erat. Etiam vulputate turpis eget est molestie malesuada.</p>
</body>
</html>
CodePudding user response：
I think you've misunderstood the property's effect.
p {page-break-after: left;} Forces page breaks after the p element so that the next page is formatted as a left page.
It doesn't mean that it moves the next paragraph on the left page