如何更改div的高度覆盖文本区域（CSS）

Question

原始CSS代码 http://www.faressoft.org/BlueCristalTheme/postView.php

结果应为

Answer 1

这里发生的事情很少：

• 您的评论框div的固定高度为100px
• 这个div中的所有元素都是绝对定位的，这会使它们脱离文档的正常流程，这会导致包含注释框div无法包裹/拉伸以适应孩子们
• 使用浮点数或只删除大于第二个<p>的较大内容的位置。使用边距来定位此<p>，请参阅下面的

我能够通过更改CSS来解决问题，如下所示：

#comments .commentBox { /* style.css line 483 */
background-color:#DCDCDC;
/*height:100px; --removed this */
min-height:100px;
position:relative;
}

#comments .commentBox .comment-content { /* style.css line 523 */
color:#676767;
font-size:0.91em;
font-weight:bold;
line-height:24px;
margin:52px 92px 0 0; /* -- added this */
/* -- removed these
position:absolute;
right:95px;
top:52px;
width:570px;
*/
}

Answer 2

你想要clearfix hack。

将其添加到样式表中：

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.clearfix {
  display: inline-block;
}

html[xmlns] .clearfix {
  display: block;
}

* html .clearfix {
  height: 1%;
}

然后，将class="clearfix"添加到您的div（或clearfix到您现有的div类），它应该正确地清除该文本。