title: css page-break-after not working
body: <p>I try to avoid page break for multiple div title (using drupal), but page-break-after:avoid does nothing (but page-break-before:always does).  is not empty, so it should work. Any hint? My code html is:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#DIV_1 {
    height: 279px;
    width: 875px;
    perspective-origin: 437.5px 139.5px;
    transform-origin: 437.5px 139.5px;
    font: normal normal normal normal 12px / normal helvetica, arial;
  }
  /*#DIV_1*/
  
  #DIV_2 {
    height: 28px;
    text-align: left;
    width: 875px;
    perspective-origin: 437.5px 14px;
    transform-origin: 437.5px 14px;
    font: normal normal bold normal 24px / normal helvetica, arial;
  }
  /*#DIV_2*/
  
  #DIV_3 {
    height: 251px;
    width: 875px;
    perspective-origin: 437.5px 125.5px;
    transform-origin: 437.5px 125.5px;
    font: normal normal normal normal 12px / normal helvetica, arial;
    margin: 0px 0px 10px;
  }
  /*#DIV_3*/
  
  #DIV_4 {
    height: 141px;
    width: 875px;
    perspective-origin: 437.5px 70.5px;
    transform-origin: 437.5px 70.5px;
    font: normal normal normal normal 12px / normal helvetica, arial;
  }
  /*#DIV_4*/
  
  #DIV_5 {
    break-after: avoid;
    height: 23px;
    text-align: left;
    width: 875px;
    perspective-origin: 437.5px 11.5px;
    transform-origin: 437.5px 11.5px;
    font: italic normal normal normal 20.4px / normal helvetica, arial;
    margin: 0px 0px 5px;
  }
  /*#DIV_5, #DIV_50*/
  
  #DIV_6 {
    height: 113px;
    width: 875px;
    perspective-origin: 437.5px 56.5px;
    transform-origin: 437.5px 56.5px;
    font: normal normal normal normal 12px / normal helvetica, arial;
    margin: 0px 0px 10px;
  }
  /*#DIV_6*/
  
  #TABLE_7 {
    border-collapse: collapse;
    break-inside: avoid;
    height: 112px;
    width: 875px;
    perspective-origin: 437.5px 56.5px;
    transform-origin: 437.5px 56.5px;
    font: normal normal normal normal 12px / normal helvetica, arial;
    margin: 0px 0px 15px;
  }
  /*#TABLE_7*/
  
  #CAPTION_8 {
    border-collapse: collapse;
    height: 21px;
    text-align: left;
    width: 875px;
    perspective-origin: 437.5px 10.5px;
    transform-origin: 437.5px 10.5px;
    border-spacing: 2px 2px;
    font: normal normal bold normal 18px / normal helvetica, arial;
  }
  /*#CAPTION_8, #CAPTION_53*/
  
  #THEAD_9 {
    border-collapse: collapse;
    break-inside: avoid;
    height: 22px;
    width: 875px;
    perspective-origin: 437.5px 11px;
    transform-origin: 437.5px 11px;
    border: 0px none rgb(128, 128, 128);
    border-spacing: 2px 2px;
    font: normal normal normal normal 12px / normal helvetica, arial;
  }
  /*#THEAD_9, #THEAD_54*/
  
  #TR_10 {
    border-collapse: collapse;
    break-inside: avoid;
    height: 22px;
    vertical-align: middle;
    width: 875px;
    perspective-origin: 437.5px 11px;
    transform-origin: 437.5px 11px;
    background: rgba(0, 0, 0, 0) linear-gradient(rgb(218, 241, 255) 0%, rgb(175, 232, 255) 100%) repeat scroll 0% 0% / auto padding-box border-box;
    border: 0px none rgb(128, 128, 128);
    border-spacing: 2px 2px;
    font: normal normal normal normal 12px / normal helvetica, arial;
  }
  /*#TR_10, #TR_55*/
  
  #TH_11 {
    border-collapse: collapse;
    break-inside: avoid;
    height: 14px;
    text-align: left;
    vertical-align: middle;
    width: 72px;
    perspective-origin: 43px 11px;
    transform-origin: 43px 11px;
    border-spacing: 2px 2px;
    font: normal normal bold normal 12px / normal helvetica, arial;
    padding: 4px 7px;
  }
  /*#TH_11, #TH_12, #TH_56*/
  
  #TH_13 {
    border-collapse: collapse;
    break-inside: avoid;
    height: 14px;
    text-align: left;
    vertical-align: middle;
    width: 197px;
    perspective-origin: 105.5px 11px;
    transform-origin: 105.5px 11px;
    border-spacing: 2px 2px;
    font: normal normal bold normal 12px / normal helvetica, arial;
    padding: 4px 7px;
  }
  /*#TH_13, #TH_58*/
  
  #TH_14 {
    border-collapse: collapse;
    break-inside: avoid;
    height: 14px;
    text-align: left;
    vertical-align: middle;
    width: 110px;
    perspective-origin: 62px 11px;
    transform-origin: 62px 11px;
    border-spacing: 2px 2px;
    font: normal normal bold normal 12px / normal helvetica, arial;
    padding: 4px 7px;
  }
  /*#TH_14, #TH_59*/
  
  #TH_15 {
    border-collapse: collapse;
    break-inside: avoid;
    height: 14px;
    text-align: left;
    vertical-align: middle;
    width: 165px;
    perspective-origin: 89.5px 11px;
    transform-origin: 89.5px 11px;
    border-spacing: 2px 2px;
    font: normal normal bold normal 12px / normal helvetica, arial;
    padding: 4px 7px;
  }
  /*#TH_15, #TH_60*/
  
  #TH_16 {
    border-collapse: collapse;
    break-inside: avoid;
    height: 14px;
    text-align: left;
    vertical-align: middle;
    width: 77px;
    perspective-origin: 45.5px 11px;
    transform-origin: 45.5px 11px;
    border-spacing: 2px 2px;
    font: normal normal bold normal 12px / normal helvetica, arial;
    padding: 4px 7px;
  }
  /*#TH_16, #TH_61*/
  
  #TH_17 {
    border-collapse: collapse;
    break-inside: avoid;
    height: 14px;
    text-align: left;
    vertical-align: middle;
    width: 84px;
    perspective-origin: 49px 11px;
    transform-origin: 49px 11px;
    border-spacing: 2px 2px;
    font: normal normal bold normal 12px / normal helvetica, arial;
    padding: 4px 7px;
  }
  /*#TH_17, #TH_62*/</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="DIV_1"&gt;
    &lt;div id="DIV_2"&gt;
      Anoia
    &lt;/div&gt;
    &lt;div id="DIV_3"&gt;
      &lt;div id="DIV_4"&gt;
        &lt;div id="DIV_5"&gt;
          Sant Martí de Tous
        &lt;/div&gt;
        &lt;div id="DIV_6"&gt;
          &lt;table id="TABLE_7"&gt;
            &lt;caption id="CAPTION_8"&gt;
              Can Aubareda
            &lt;/caption&gt;
            &lt;thead id="THEAD_9"&gt;
              &lt;tr id="TR_10"&gt;
                &lt;th id="TH_11"&gt;
                  Data inici
                &lt;/th&gt;
                &lt;th id="TH_12"&gt;
                  Data fi
                &lt;/th&gt;
                &lt;th id="TH_13"&gt;
                  Entitat
                &lt;/th&gt;
                &lt;th id="TH_14"&gt;
                  Municipi
                &lt;/th&gt;
                &lt;th id="TH_15"&gt;
                  Contacte
                &lt;/th&gt;
                &lt;th id="TH_16"&gt;
                  Telèfon
                &lt;/th&gt;
                &lt;th id="TH_17"&gt;
                  Persones
                &lt;/th&gt;
              &lt;/tr&gt;
            &lt;/thead&gt;
          &lt;/table&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>