％高度沒有父母的高度

是否有可能在不知道父母的高度的情況下給出div的高度？或者更好地說，如果父母的身高改變了。如果這是不可能的：％高度沒有父母的高度
什麼是更好的方式有一個文本和顏色的背景和一切靈活的任何設備？文本應該與背景有一定的距離。像這樣的情況：

HTML：

<div class="grey"> 
<div class="text"> 
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam magna erat, viverra at elementum at, elementum vitae mauris. Aenean in quam lorem, ut blandit ante. Integer sit amet nisi massa, at adipiscing nunc. Duis in risus a sapien blandit ultrices. Morbi ut ante eu neque porta lacinia et sed nisi. Donec luctus, enim in hendrerit ornare, purus libero adipiscing tortor, eget volutpat nunc tellus vitae turpis. Mauris sed fringilla nibh. Mauris pellentesque mauris eget velit iaculis tincidunt. Suspendisse neque velit, adipiscing nec consectetur sit amet, porttitor sed tortor. Vestibulum interdum auctor lorem, a porta metus eleifend in. Maecenas a lobortis neque. Duis fermentum arcu purus. Praesent eget diam sed felis varius semper ut a tortor. Cras bibendum sollicitudin facilisis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Ut auctor adipiscing risus, eget interdum libero ultricies at. 
</div><!-- end text --> 
</div><!-- end grey -->

CSS：

html, body { height: 100%; width: 100%; margin: 0; } 

.grey{ 
    position:relative; 
    margin:0px auto; 
    top:0px; left:0px; 
    width:90%; 
    height:auto; 
    min-width:320px; 
    background:grey;   
} 

.text { 
    position:relative; 
    margin:0px auto; 
    width:80%; 
    height:80%; /* this does no work ? */ 
}

來源

2013-05-03 Nrc

沒有，因爲父母的身高將永遠同孩子們的 – Morpheus 2013-05-03 08:45:04

http://stackoverflow.com/questions/1122381/how-to-force-child-div-to-100-父母 - 母親 - 沒有指定 - 父母 - 身高 – Morpheus 2013-05-03 08:54:26

難道這就是你在哪裏想達到什麼目的？

我用填充而不是高度。

http://jsfiddle.net/WSACt/

.text { 
    position:relative; 
    margin:0px auto; 
    padding:10%; 
}

來源

2013-05-03 09:31:31 Kayo

如果將填充設置爲百分比，它始終與父寬度相關，即使使用'padding-top：10 ％'。 – xpy 2013-05-03 09:34:43

也許你應該改寫你的問題來更好地描述你實際嘗試實現的目標，而不是技術問題。我可能會誤解你想要做的事情。編輯：對不起，以爲你在哪裏OP – Kayo 2013-05-03 09:37:55

好吧。謝謝。但在你的小提琴中，你必須刪除.text的寬度和高度。這裏解決了：http://jsfiddle.net/WSACt/1/ – Nrc 2013-05-03 10:05:29

如果.text有％的高度，那麼它的高度將是最接近的祖先元素與非靜態位置的百分比。如果祖先的身高是auto那麼它的身高就會被拉伸到它的內容。如果它內部的唯一內容是.text元素，那麼它的高度是由.text高度定義的，換句話說，這意味着.text高度應該計算爲它自己的高度的80％當然這是不能計算的。

但是

如果.text不在.grey的唯一元件，它是絕對定位然後，.grey高度將通過在其中的其他內容來計算，然後，.text將是80％它。

example

來源

2013-05-03 09:28:22 xpy

這對於CSS的初始設計有點像 – Barney 2013-05-03 09:30:04

％高度沒有父母的高度

回答

相關問題