0
我試圖將絕對定位元素的高度設置爲80%,並將其頂部和底部邊距設置爲10%,以便給出元素80%的窗口高度並離開其他元素將出現在那裏10%以上的空間。CSS:將邊距設置爲窗口高度的10%
但是,正如你可以在這個小提琴http://jsfiddle.net/qnLC2/中看到的那樣,並且如W3C CSS Box-model規範所述,所有邊距的寬度實際上都設置爲窗口寬度的10%(不是高度)(嘗試調整輸出屏幕的大小和使其更寬以查看效果)。
W3C CSS盒模型規格:
The percentage is calculated with respect to the width of the generated box's
containing block. Note that this is true for 'margin-top' and 'margin-bottom' as well.
If the containing block's width depends on this element, then the resulting layout is
undefined in CSS 2.1.
我想知道是否有任何CSS只解決這個問題的一種方法。
的代碼的jsfiddle: HTML:
<div></div>
CSS:
div {
min-width:20px;
min-height:20px;
background:blue;
position:absolute;
height:80%;
width: 80%;
margin:10%;
}
body{
background:red;
}
你在說什麼瀏覽器?您的示例在Webkit中正常工作。在IE和Firefox中短缺 – jQuerybeast
我可以確認它在Webkit中的工作方式。 –
好吧,看起來webkit不符合w3c標準以及mozilla的做法 –