page-break-* doesn't work on Google chrome

Question

I just like the divs under .wp_left_col div be placed in separate pages. This is my css code.

.wpi_left_col > div {         


        

Answer 1

here's an easier solution for setting all parent elements to not float on print:

@media print {
  * { 
    float: none !important; 
  }
  .tab {
    display: block;
    break-before: always;
    page-break-before: always;
  }
}