與元素而不是瀏覽器窗口連接的邊距格式化？

美好的一天！今天我遇到了一個奇怪的問題。這有點奇怪，但我碰到了我很開心，因爲現在我開始學習新東西。與元素而不是瀏覽器窗口連接的邊距格式化？

它是在我的理解，餘量（我們談論純CSS定位大氣壓）是基於其中所述元件是在所述容器上。
例如，如果我有一個div與width X和height Y和2段在其中，當我將該段落的樣式設置爲margin-top : 2%時，它將位於頂部2％的像素之後。
對於我來說，如果沒有容器，瀏覽器會考慮窗口的邊界。顯然這種理解是錯誤的。

我是如何得出這個結論的：考慮以下內容 - 一條橫幅，從頂部1％，頂部2％的登錄框和頂部8％的內容欄。（還有左邊距值，但它們無關緊要，因爲解決方案也是解決問題的辦法）

實際發生的情況是邊距取自最後一個元素之後，因此這意味着登錄盒子在菜單框後面的樣式爲2％，這意味着它的偏移量是所有以前元素的所有偏移量的總和。

我的問題是我該如何處理它？我怎樣才能使窗口的邊界，而不是以前的元素的邊緣？

而且，這裏是源代碼，如果有人願意我寫什麼：

<!DOCTYPE html> 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <title></title> 
<style> 

    .menu { 
    width:600px; 
    height:100px; 
    background-color:black; 
    margin-top:1%; 
    margin-left:33%; 
    float:left; 
    } 

    .login { 
    width: 150px; 
    height: 200px; 
    background-color:red; 
    margin-top:2%; 
    margin-left:87%; 
    float:none; 
    } 

    .content { 
    width:600px; 
    min-height:300px; 
    background-color:blue; 
    float:left; 
    margin-top:1%; 
    margin-left:33%; 
    } 

    .flush { 
     clear: both; 
    } 

    body { 
    background-color:#daeaf1; 
    } 
</style> 
</head> 
<body> 
    <div class="menu"></div><div class="login"></div><div class="content"></div> 
</body> 
</html>

來源

2013-06-26 Bloodcount

好了，你發現那個流是正確的利潤率是與HTML元素。

如果你想設置元素流出，那麼你應該玩位置，頂部，左側，右側和底部屬性。

可能是在你的情況，你應該要使用：

.login { 
    position: absolute; 
    top: 2px; 
    right: 20px; 
    ... 
}

來源

2013-06-26 16:18:21 Aguardientico

啊，這做的伎倆。我將對相對，固定，絕對和靜態定位進行一些研究。 – Bloodcount

這個網站可以幫助我理解html和css http://www.w3schools.com/ – Aguardientico

與元素而不是瀏覽器窗口連接的邊距格式化？

回答

相關問題