1
我有一個標題和菜單欄，我已經修復留在頁面的頂部，所以當有人在頁面上滾動或菜單和標題在手邊。問題與固定菜單
我的問題是關於頁面的內容/正文。我嘗試過使用絕對定位從頂部向下150像素（菜單和標題爲125像素），並且我希望頁面頂部的兩個像素之間的距離爲25像素。
但是，它位於頁面的左側，但我希望它以流暢的方式居中。
我也試着給出一個150px的頂部邊距，但是由於某種原因沒有工作。
我怎樣才能水平居中它，但垂直頂部至少有150px？
這是一些代碼。
如果您需要更直觀的東西，您可以在我的測試網站http://sunnahmatch.com上看看現在發生了什麼。
編輯我有垂直間距向下。現在，如果我能弄清楚如何居中呢？ ：/
<style type="text/css">
body{
margin:0;
background-color:#333;
}
#body_container{
position:absolute;
top:150px;
padding:15px;
margin:0 auto;
width:70%;
}
#left_container{
float: left;
width: 63%;
padding:5px;
margin-right:15px;
background-color:#069;
-moz-border-radius-topleft: 15px 15px;
-moz-border-radius-bottomright: 15px 15px;
border-top-left-radius: 15px 15px;
border-bottom-right-radius: 15px 15px;
}
#right_container{
float:left;
width: 31%;
padding:5px;
background-color:#069;
-moz-border-radius-topleft: 15px 15px;
-moz-border-radius-bottomright: 15px 15px;
border-top-left-radius: 15px 15px;
border-bottom-right-radius: 15px 15px;
}
.column_left_tmpl{
background-color:#FFF;
padding:10px;
-moz-border-radius-topleft: 10px 10px;
-moz-border-radius-bottomright: 10px 10px;
border-top-left-radius: 10px 10px;
border-bottom-right-radius: 10px 10px;
font-family: GeosansLight;
font-size: 16px;
}
.column_right_tmpl{
background-color:#FFF;
padding:8px;
-moz-border-radius-topleft: 10px 10px;
-moz-border-radius-bottomright: 10px 10px;
border-top-left-radius: 10px 10px;
border-bottom-right-radius: 10px 10px;
font-family: GeosansLight;
font-size: 16px;#59C169
}
.title {
width:100% auto;
padding-top:5px;
margin-bottom:5px;
-moz-border-radius-topleft: 5px 5px;
-moz-border-radius-bottomright: 5px 5px;
border-top-left-radius: 5px 5px;
border-bottom-right-radius: 5px 5px;
font-family: Arial, Gadget, sans-serif;
font-size:22px;
color:#333;
font-weight: bold;
}
.spacer{
height:5px;
}
#menu_container{
margin:0;
position:fixed;
top:0;
left:0;}
</style>
<body>
<div id="menu_container">
<?php include_once "pages/header.php" ?>
</div>
<div id="body_container">
<div id="left_container">
<div class="column_left_tmpl">
<div class="title">Title</div>
"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</div>
<div class="spacer">
</div>
<div class="column_left_tmpl">"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</div>
</div>
<div id="right_container">
<div class="column_right_tmpl">
<div class="title">Title</div>
"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</div>
</div>
</div>
<div>
<?php include_once "pages/footer.php" ?>
</div>
不，我有完整的文檔類型，HTML，身體等標籤，我只是沒有包括他們，因爲我認爲它會重複和假設，：/ – Nathan
同意，但有趣的方面是，如果你打開你的網站在Opera或FF中，然後選擇「查看源代碼」它不會顯示它們。我認爲這可能與正文中的'style'標記有關。請參閱我的更新。 （在IE的「查看源代碼」中，你可以看到你的文檔類型和html等） – Bazzz
該修復工作的大部分，除了我有一個150px的邊緣整個事情，我只是希望它在頂部雖然。 – Nathan