3
我已經爲我的問題尋找解決方案，但是我沒有找到它。
我的情況是，我有一個DIV，像一個郵政的容器（我的項目，在這篇文章裏面有海報頭像，名字，時間戳，文本等的類）。問題是，即使具有文本（POST_TEXT）的DIV自身的大小，這就像一個容器不DIV的，所以出現這種情況：根據孩子內部的內容調整容器DIV大小DIV
打印更好地理解：http://imgur.com/a/j2HVX#0
這是我的實際代碼：
<div class="post_container">
<div class="post_who">
<div class="post_avatar"><img src="avatar2.png" /></div>
<div class="post_name">Solange Campolina</div>
<div class="post_timestamp">03/04/15<br />15:34</div>
</div>
<div class="post_info">
<div class="post_title">Trabalho sobre fotografia</div>
<div class="post_text">RANDOM PORTUGUESE WORDS: É importante questionar o quanto a determinação clara de objetivos estende o alcance e a importância de alternativas às soluções ortodoxas. A prática cotidiana prova que o início da atividade geral de formação de atitudes cumpre um papel essencial na formulação dos relacionamentos verticais entre as hierarquias. No entanto, não podemos esquecer que a contínua expansão de nossa atividade é uma das consequências das posturas dos órgãos dirigentes com relação às suas atribuições. O cuidado em identificar pontos críticos no fenômeno da Internet auxilia a preparação e a composição do orçamento setorial.<span class="post_value">Valor: 3,0 E1AMP</span></div>
</div>
<div class="post_links">
<a><div class="post_button">
<img src="icon_date.png" /><span>24/04/15</span>
</div></a>
<a href="#"><div class="post_button">
<img src="icon_attachment.png" /><span>1</span>
</div></a>
<a href="aluno_disciplinas_disciplina_comentarios.htm"><div class="post_button">
<img src="icon_comment.png" /><span>3</span>
</div></a>
</div>
<div class="post_divider"></div>
</div>
這是簡化的代碼，只有重要的部分：
<div class="post_container">
<div class="post_who">
<!--Content!-->
</div>
<div class="post_info">
<div class="post_title"><!--Title!--></div>
<div class="post_text"><!--Content (text goes here)!--><span class="post_value">Valor: 3,0 E1AMP</span></div>
</div>
<div class="post_links">
<!--Buttons!-->
</div>
<div class="post_divider"><!--This is the light gray line that divides the posts!--></div>
</div>
的CSS部分：
/*Relevant classes:*/
.post_container{
position: relative;
min-height: 140px;
height: auto;
}
.post_info{
position: absolute;
display: inline-block;
vertical-align: top;
margin: 20px 20px 0px 20px;
padding-bottom: 32px;
width: 550px;
}
.post_links{
position: absolute;
bottom: 5;
left: 110px;
}
.post_divider{
background-color: #e8e8e8;
height: 1px;
width: 85%;
position: absolute;
right: 0;
bottom: 0;
}
.post_text{
height: auto;
}
/*Other classes:*/
.post_who{
display: inline-block;
margin: 10px;
font-style: italic;
font-size: 1.2em;
text-align: center;
width: 75px;
}
.post_avatar{
border: 1px solid whitesmoke;
border-radius: 50%;
overflow: hidden;
width: 60px;
height: 60px;
position: relative;
bottom: 0px;
margin: 15px 0 0 5px;
}
.post_avatar img{
vertical-align: middle;
display: block;
width: 60px;
min-width: 100%;
min-height: 100%;
}
.post_name{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 65px;
}
我看到，作爲文本在「POST_TEXT」 DIV增長的方式，「post_container」 DIV應該有它的高度調節，因爲高度設置作爲自動。根據我在這裏看到的另一個問題，我嘗試將'overflow：auto'設置爲'post_container'，但它所做的只是向它添加滾動條。我需要解決這個沒有任何腳本。
小提琴：http://jsfiddle.net/3ck990zc/
您的子元素是絕對定位的，因此它們不在內容流中，因此它們不會影響父容器的高度。嘗試刪除絕對定位。 –
男人我不能相信所有這個問題只是因爲這個，我試圖糾正這個小時，這是真的。我真的不知道，絕對定位的元素並沒有助長父母的高度。謝謝！ –