javascript - 使用 jQuery 溢出到下一个 div

Question

我正在使用一些技巧来处理溢出问题。 js 复制第一个 div 内容并将其粘贴到具有负顶部偏移量的第二个。

.bg {
  position:relative;
  width:8.5in; height:11in;
  background-color:#306;
}
.content-wrap {
  position:absolute;
  width:8in; height:10.5in;
  padding: 25px 15px;
  background-color:#FFF;
  left:0.25in; top:0.25in;                         
}
.content {
  max-width:100%; max-height:100%;
  overflow:hidden;
  background-color:#CCC;                           
}

<div class="bg">
    <div class="content-wrap">
        <div id="mydiv1" class="content">           
            some html...<p></p>...<ul></ul>...<div></div>
        </div>
    </div>
</div> 


<div class="bg">
    <div class="content-wrap">
        <div id="mydiv2" class="content"></div>      
    </div> 
</div> 

var copy = $("#mydiv1").clone().css({
    "margin-top": '-'+ $("#mydiv1").height() +'px',
    "height": $("#mydiv1").height() * 2 +'px'});

$("#mydiv2").append(copy);

正如您在下一张图片中看到的，它并不完美。如何获得完美的结果？

Answer 1

问题是您的 div 的高度与文本的行高不匹配。您的行高需要能被 div 的高度整除。尝试调整它，使第一个框的最后一行与底部齐平。