如何防止破坏元素的边界Laravel Dompdf

问题描述

您好，我正在使用laravel dompdf渲染PDF文件。我添加了page-break-inside：避免！important;但是元素break，上一页的顶部边框和所有其他内容在下一页。我只想避免破坏该元素，如果空间不足，则从下一页开始。有人可以帮忙吗？感谢并高度赞赏

这是html元素：

<div class="row">
              
                
              <div class="no_breaks">
              <div class="country-details">
                     <img class="text-wrap-left" src="image base 64 data">
                     <h2>Tag - 1<span class="low-color">Mexico Stadt</span></h2>
                   <p> <h3><b>DAS HISTORISCHE ZENTRUM</b>&nbsp;<i> (A)</i></h3></p>
                <div class="detail-content">
                  <p>Ihr erster Tag in Mexiko beginnt mit einem begleiteten ..</p>
                  <div class="spacer" style="clear: both;"></div>
                </div>
               </div>
            </div>
              
                             
            
            
            
              <div class="no_breaks">
              <div class="country-details">
                     <img class="text-wrap-left" src="image base 64 data">
                     <h2>Tag - 2<span class="low-color">Mexico Stadt</span></h2>
                   <p> <h3><b>COYOACÁN - XOCHIMILCO - UNIVERSITÄT VON MEXIKO</b> <i>(F)</i></h3></p>
                <div class="detail-content">
                  <p>Heute tauchen Sie in den lebhaften ...............</p>
                  <div class="spacer" style="clear: both;"></div>
                </div>
               </div>
            </div>
            
        </div>

这是元素中使用的CSS部分。

  /* line 186,main/pdf.scss */
.main-wrapper .wrapper-content .body-section .container .row .country-details {
  position: relative;
  margin-bottom: 35px;
   border: 2px solid #e6e7e9;
}

.no_breaks{
    page-break-inside: avoid !important;
}
/* line 202,main/pdf.scss */
.main-wrapper .wrapper-content .body-section .container .row .country-details .detail-content {
  padding: 3% 2% 3% 1%;
}
/* line 204,main/pdf.scss */
.main-wrapper .wrapper-content .body-section .container .row .country-details h3 {
  font-size: 20px;

  letter-spacing: 0.5;
  color: #000000;
}
/* line 211,main/pdf.scss */
.main-wrapper .wrapper-content .body-section .container .row .country-details .detail-content h2 {
  font-size: 34px;
  text-transform: capitalize;
  letter-spacing: 0.5;
  color: #000000;
}
/* line 216,main/pdf.scss */
.main-wrapper .wrapper-content .body-section .container .row .country-details  h2 span {
  margin-left: 12px;
}
/* line 218,main/pdf.scss */
.main-wrapper .wrapper-content .body-section .container .row .country-details  h2 span.low-color {
  font-weight: bold;
}
/* line 223,main/pdf.scss */
.main-wrapper .wrapper-content .body-section .container .row .country-details .detail-content h4 {
  font-size: 24px;
  letter-spacing: 0.5;
  color: #000000;
}
/* line 228,main/pdf.scss */
.main-wrapper .wrapper-content .body-section .container .row .country-details  h4 span.low-color {
  font-weight: bold;
}

结果：

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）