第一個孩子的負利潤率如何影響下一個元素的位置？

-3

<div style="overflow:hidden;"> 
    <div id="d1" style="margin-top:-50px; height:10px;"></div> 
    <div id="d2" style="height:30px;"></div> 
    <div id="d3" style="height:30px;"></div> 
</div>

我的問題是如何的元素D2和D3會放在哪裏？在第一個元素之後？即使d2將被隱藏，並且d3將被半隱藏（隱藏10px）。或者這兩個元素將被放置在父項的可見區域？

這裏我的問題是關於確切的CSS規範。

來源

2016-06-25 fekiri malek

你爲什麼不直接在jsfiddle.net這樣的代碼編輯器中試試？ – skyline3000

可能是因爲jsfiddle.net沒有在上下文中引用CSS規範（除非這是我不知道的新功能）？ – BoltClock

如何在第一個孩子的負面影響保證金的下一個元素的位置？

與零或正邊距如何影響後續元素的位置無關，假設所有內容都處於流程中：從頂部開始的正邊距會推動一個方框並使方框向下，這樣就會產生一個負值從頂部的邊緣拉動一個盒子並隨着盒子向上。包含塊上overflow屬性的值在正常流程中無關緊要。

該規範沒有明確提及這一點，僅僅是因爲在此特定情況下沒有關於負邊距的特殊規則。這只是基本的數學。還有許多關於負邊限的其他特殊規則，但根本不適用於這種情況。

來源

2016-06-26 08:42:18 BoltClock

第一個孩子的負利潤率如何影響下一個元素的位置？

簡而言之，他們遵循，雖然它比這更復雜一點，所以我建議您在這裏閱讀更多的規範。

body { 
 
    padding: 50px; 
 
} 
 
#d { 
 
    position: relative; 
 
    background: red; 
 
    border: 5px solid red; 
 
} 
 
#d1 { 
 
    background: green; 
 
} 
 
#d2 { 
 
    background: yellow; 
 
} 
 
#d3 { 
 
    background: blue; 
 
} 
 

 
/* these is for demo purpose only */ 
 
#d:before { 
 
    content: ''; 
 
    background: red; 
 
    position: absolute; 
 
    width: 100%; 
 
    height: 5px; 
 
    top: -5px; 
 
    left: 0; 
 
    z-index: 1; 
 
} 
 
#d:after { 
 
    content: ''; 
 
    background: white; 
 
    position: absolute; 
 
    width: 100%; 
 
    height: 45px; 
 
    top: -50px; 
 
    left: 0; 
 
    opacity: .7; 
 
    z-index: 1; 
 
}

<div id="d"> 
 
    <div id="d1" style="margin-top:-50px; height:10px;"></div> 
 
    <div id="d2" style="height:30px;"></div> 
 
    <div id="d3" style="height:30px;"></div> 
 
</div>

來源

2016-06-25 18:52:05 LGSon

第一個孩子的負利潤率如何影響下一個元素的位置？

回答

相關問題