Question

我一直在阅读与我有同样问题的人的其他帖子，但这些解决方案似乎都没有帮助我。所以，这是关于我的 .news-post div高度的另一篇文章，没有调整以适应其中的内容。这是代码：

HTML：

<div id="wrapper">
    <div class="news-post">
        <div class="news-post-header">
            <a href="#"><h3>Fake News: blah blah blah.</h3></a><a href="#"><h3 style="float: right">July 26, 2013</h3></a>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eget tempor diam. Vivamus eget neque ultrices, accumsan risus et, laoreet dui. Curabitur eu ligula fermentum, molestie orci sit amet, molestie ante. Morbi id massa laoreet, pellentesque magna nec, ultrices dui. Nulla tempus est massa, in euismod velit congue eu. Curabitur ac congue dui. Curabitur id risus tempor, mattis odio vel, faucibus nisi. Nullam pretium, dolor id auctor hendrerit, metus lacus volutpat orci, sed dapibus lorem lacus non felis. Aliquam felis lorem, posuere nec fringilla eu, aliquam in ligula. Duis ultrices, ante in vestibulum sollicitudin, lectus mi tristique tellus, in volutpat est lorem nec mi.</p>
        </div>
    </div>
</div>

CSS：

#wrapper {
margin: auto auto;
width: 1024px;
}
.news-post {
background: #fff url('images/skydive.png') no-repeat;
margin: 30px 30px 0 0;
height: auto;
min-height: 100% !important;
width: 642px;
display: block;
position: absolute;
overflow: visible;
-moz-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow:    0 1px 3px 0 #ccc;
-webkit-box-shadow: 0 1px 3px 0 #ccc;
box-shadow:         0 1px 3px 0 #ccc;
}
.news-post-header {
background: url('images/content-header-bg.png');
background-repeat: repeat-x;
margin: 0;
height: 47px;
line-height: 40px;
width: 642px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.news-post-header h3 {
margin: 0 15px;
font-family: 'droid_sansbold';
font-size: 14px;
text-shadow: 0 1px 0 #626262;
color: #fff;
float: left;
}
.news-post-header p {
padding: 445px 15px 0 15px;
text-align: justify;
}

非常感谢帮助！

Answer 1

我认为这是因为您为height设置了.news-post-header参数。如果你删除它将工作正常。

Answer 2

我在这里制作了你的代码。看看，如果这是你正在寻找的，请告诉我。

link：http://jsfiddle.net/daltonpereira/2ZXx9/

下面是我改变了。基本上删除了高度：47px from news-post-header class

.news-post-header {
 background: url('images/content-header-bg.png');
 background-repeat: repeat-x;
 margin: 0;

line-height: 40px;
width: 642px;
-moz-border-radius: 4px;
border-radius: 4px;
}

另一个div高度不适合内容帖子

2 个答案: