css分页后不起作用

Question

我尝试避免多个 div 标题的分页符（使用 drupal），但 page-break-after:avoid 什么都不做（但 page-break-before:always 会）。不是空的，所以它应该工作。有什么提示吗？我的代码html是：

#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*/

<div id="DIV_1">
  <div id="DIV_2">
    Anoia
  </div>
  <div id="DIV_3">
    <div id="DIV_4">
      <div id="DIV_5">
        Sant Martí de Tous
      </div>
      <div id="DIV_6">
        <table id="TABLE_7">
          <caption id="CAPTION_8">
            Can Aubareda
          </caption>
          <thead id="THEAD_9">
            <tr id="TR_10">
              <th id="TH_11">
                Data inici
              </th>
              <th id="TH_12">
                Data fi
              </th>
              <th id="TH_13">
                Entitat
              </th>
              <th id="TH_14">
                Municipi
              </th>
              <th id="TH_15">
                Contacte
              </th>
              <th id="TH_16">
                Telèfon
              </th>
              <th id="TH_17">
                Persones
              </th>
            </tr>
          </thead>
        </table>
      </div>
    </div>
  </div>
</div>

Answer 1

将div 更改为span 不适合您的情况？

Answer 2

尝试添加#DIV_2 {display: inline}，但最好使用适当的html元素，以防div将其替换为span是更好的解决方案，因为div是block element。