從我的div頂部正好29px而不移動它？

我有一個由4個div組成的網站佈局。從我的div頂部正好29px而不移動它？

<div class="global"> 
<div class="content"> 
</div> 
<div class="top"> 
</div> 
<div class="footer"> 
</div> 
</div>

的有以下樣式應用

div.top{ 
position:fixed; 
top:0px; 
width:100%; 
height:28px; 
background-color:rgb(55,55,55); 
border-bottom:1px solid black; 
}

的有以下樣式應用

div.footer{ 
position:fixed; 
float:right; 
bottom:0px; 
left:87.5%; 
border:1px solid:black; 
border-bottom:0; 
}

和具有該

div.content{ 
position:absolute; 
bottom:0; 
top:28px; 
width:100%; 
background:transparent; 
margin:auto; 
padding:0; 
}

我有問題與內容div，我w螞蟻它直接從頂部下方開始，繼續沿着頁面的其餘部分，但是它會覆蓋整個頁面的底部，然而很多px我也會設置頂部的位置。現在，因爲我使用px作爲頂部的大小，所以我無法應用百分位，那麼使用只有css才能做到這一點的最佳方法是什麼。

的網站，我需要這個是http://www.andysinventions.info/test/和問題，可在標籤上看到標有「論壇」

文藝青年最愛的我怎麼能阻止我去的div在頁面邊界？

來源

2012-04-04 Andrew Fairbairn

安德魯，

兮兮的答案（這是大部分正確的），你的網站之後 - 我注意到你正在使用的I幀。在2012年，iframe作爲設計功能已成爲過去，只能用作第三方附加組件，如異地小部件和饋送（或沙箱）。

您需要構建你的頁面類似這樣的東西，你會爲：

<!doctype html> 
<html> 
    <head> 
    <title>A title</title> 
    <link href="style.css" rel="stylesheet" /> 
    </head> 
    <body> 
    <ul id="menu"> 
     <!-- menu content here --> 
    </ul> 
    <!-- Actual page content here --> 
    </body> 
</html>

在style.css中有下列規則：

body { margin: 28px 0 0; } 

ul#menu { 
    position: absolute; 
    top: 0; 
    left: 0; 
    }

這應該做到你在找什麼採用現代技術。

來源

2012-04-04 19:57:28

非常感謝你，我知道iframe已經有幾年了，我真的很想用別的東西，但我找不到正確的東西，儘管我仍然需要能夠在網站中設置一個目標來加載頁面可以這樣做，還是我需要在每個頁面上都有菜單？ – 2012-04-04 20:04:30

通常你只包含（'header.php'）;在所有文件的頂部，假設您沒有使用自動加載器或可以爲您完成的框架。 Header.php通常會包含您的到您的標籤。 – 2012-04-04 20:07:07

我剛剛意識到你正在爲這個網站做直接的HTML，你可能想看看使用一點PHP。您的服務器可能支持它，因爲我可以看到您也在運行Apache，而這兩者通常是配對的。 – 2012-04-04 20:08:52

，而不是絕對位置和頂部，嘗試的margin-top：28px：

div.content{ 
    bottom:0; 
    width:100%; 
    background:transparent; 
    margin: 28px auto 0 auto; 
    padding:0; 
}

來源

2012-04-04 19:28:36 Gavriel

發生這種情況，因爲你正在使用頂：28px;向下移動頂部欄。相反，您應該使用margin-top：28px;並拿出絕對定位。

div.content{ 
    width:100%; 
    background:transparent; 
    margin:28px auto 0 auto; 
    padding:0; 
}

來源

2012-04-04 19:30:42 Drew

千萬不要像這樣的風格加倍...使用'margin：28px auto 0;'就像Flöcsy發佈 – 2012-04-04 19:32:57

我同意，我繼續前進，並改變了答案。我剛剛從我的Chrome開發人員工具中粘貼。感謝您指出了這一點。 – Drew 2012-04-04 19:37:41

我仍然遇到同樣的問題，我在頁面的超卷中丟失了28px。 – 2012-04-04 19:38:37

從我的div頂部正好29px而不移動它？

回答

相關問題