CSS定位問題

好吧，我目前在這個網站上工作，http://www.katiesamsonlaxfest.com/preview.html。我想在頁面的左下角添加一些聯繫信息（位於內容區域下方，位於背景的頁腳導航左側）。我也希望能夠保持頁腳導航居中。有什麼建議麼？CSS定位問題

來源

2010-02-02 Dan

我可能沒有正確理解，但是您的請求有點矛盾：在nav左側添加信息會偏移導航，不再使其居中。 – sthg 2010-02-02 02:26:16

這就是要點，我需要一個解決方法。我希望聯繫信息在Nav保持居中時左側浮動，我需要一個解決方案 – Dan 2010-02-02 02:27:41

最簡單的方法，給你的佈局，可能是定位的東西與相對定位。 IE瀏覽器 - 在你的頁腳div中，指定2個div。使一個20％ish寬度，第二個80％ish寬。將當前頁腳放入div 2中，左對齊文本，然後調整百分比，直到所有內容都很好地排列。

來源

2010-02-02 02:34:12 Quotidian

是的，我會看到如果這樣做的工作，鑑於那裏的情況可能沒有圍繞幾個div的方式 – Dan 2010-02-02 02:38:12

試試這個：

<div id="footer"> 
    <div id="left_footer"> 
    some content 
    </div> 
    <ul> 
     <li><a href="http://www.katiesamsonlaxfest.com/index.html">Home</a></li> 
     <li><a href="">The Event</a></li> 
     <li><a href="http://www.katiesamsonlaxfest.com/design.html"> The Cause </a></li> 
     <li><a href=""> The Teams </a></li> 
     <li><a href=""> To Donate </a></li> 
     <li><a href=""> The Sponsors </a></li> 
</ul> 
<p> Copyright 2010, The Katie Samson Foundation</p> 
</div>

我頁腳設置相對定位，然後將新添加的格，left_footer，被定位絕對，左0像素，以及頂部的幾個像素下來。

#footer 
{ 
    position: relative; 
} 
#left_footer 
{ 
    position: absolute; 
    left: 0px; 
    top: 28px; 
}

在Firefox和IE8中看起來沒問題。

來源

2010-02-02 02:40:28 wsanville

這是我剛剛想出了利用JSBin：http://jsbin.com/exogi/edit

似乎做你想要什麼，花車，並不會改變你的頁腳文本的中心。重要的是要注意的是，#footer上的邊距爲0（上/下）（可更改），左右等於寬度#contact-info。在大多數瀏覽器（我認爲IE6 & 7不喜歡），它應該工作得很好。

來源

2010-02-02 02:42:13

回答

相關問題