2013-07-27 186 views
0

我一直在閱讀與我有同樣問題的人的其他帖子,但沒有一個解決方案似乎對我有幫助。所以,這裏的另一個帖子是關於我的.news-post div高度未調整以適應內容。下面是代碼:另一個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; 
} 

幫助將不勝感激!

+0

是不是因爲你在'.news-post-header' div上設置了一個'height:47px'?如果這不是問題,你能解釋一下好嗎? – putvande

+0

哈哈!是的,修復它。謝謝!有時你只需要第二雙眼睛。 – wstrahan

回答

0

我認爲這是因爲你設置了height參數到你的.news-post-header。 如果你刪除它,它會正常工作。

0

我已經在這裏做了一個代碼的小提琴。看看,讓我知道這是你在找什麼。

鏈接:http://jsfiddle.net/daltonpereira/2ZXx9/

下面

是我變了。基本上刪除了高度:47px從news-post-header類

.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; 
} 
相關問題