爲什麼浮動父母的寬度不取決於其孩子的負邊距？

我有3塊一位家長和兩個孩子。所有漂浮。子塊佔用百分比（30％和70％）的寬度。其中一個（寬度爲70％）的負邊距等於其自身的寬度（margin-left:-70%）。因此它向左移動並覆蓋第一個（寬度爲30％）的塊。但是父塊，它也有float：left，反正保存寬度。爲什麼浮動父母的寬度不取決於其孩子的負邊距？

請參閱： online example

.main-container { 
    float:left; 
} 

    .sidebar-left { 
     float:left; 
     width: 30%; 
    } 

    .sidebar-right { 
     width: 70%; 
     margin-left:-70%; 
    }

爲什麼父塊不收縮的水平線？
所有塊如何計算寬度？

我想 - 父母從子塊的總寬度計算其寬度（並且不管它們中的哪一個被移位）。子塊的寬度取決於它們的內容。我可以在哪裏閱讀以瞭解此行爲？

來源

2015-11-02 Stan

由於.main-container是div（與財產display: block）它的寬度是基於父容器。 .main-container寬度的子項也基於父容器（.main-container）。

所以在這種情況下，孩子的寬度是基於父母的寬度，而不是相反。

另外，考慮一下：如果孩子的父母是35％寬，但父母的寬度由於孩子的利潤和定位而減少，那麼孩子的寬度也應該減小，導致父母的寬度減少，導致.....等等等等，直到它們的全部寬度變爲0.

來源

2015-11-02 12:09:42 Justas

正是！如果父塊有浮動。它從它的子塊計算它的寬度。所以它不能允許移動子塊並改變寬度。因爲從其寬度可能取決於其子女的寬度（可以百分比））。反過來，它自己的寬度取決於它的孩子）。謝謝！ P.S.但它適用於硬編碼寬度（通過px） – Stan

它僅在子塊的寬度完全已知時才起作用！

See the online Example

.main-container { 
    float:left; 
} 

    .sidebar-left { 
     float:left; 
     width: 300px; 
    } 

    .sidebar-right { 
     width: 700px; 
     margin-left:-700px; 
    }

在這種情況下，家長可以改變它，而不會影響它的子元素。

要知道這種行爲的原因，請看看其他答案 - Justas！

來源

2015-11-02 16:41:41 Stan

爲什麼浮動父母的寬度不取決於其孩子的負邊距？

回答

相關問題