我與我的網站掙扎，我試圖讓在底部的div在中心去。正文部分居中並顯示正常，只有文本不會在中心對齊的頁腳。有沒有人有任何想法我做錯了什麼？股利定心CSS

這是我的css代碼。

#footer{ 
float: left; 
width: 100%; 
height: 100px; 
background-image: url(images/jf_footer.png); 
color: #C7C7C7; 
font-size: 0.75em; 


} 

#footercontainer{ 
width: 960px; 
margin:0px auto; 
margin-top: 20px; 
} 

#footertext{ 
float: left; 
text-align:center; 
margin-top: 15px; 
color: #C7C7C7; 
font-size: 1em; 
} 

#footerlinks{ 
float: left;  
}

HTML：

<div id="footer"> 
    <div id="footercontainer"> 
     <div id="footertext">Copyright NV Blinds 2012</div> 
     <div id="footerlinks"> 
      <ul> 
       <li>Home</li> 
       <li>About</li> 
       <li>The Collections</li> 
       <li>Distributors</li> 
       <li>Our Team</li> 
       <li>Contact</li> 
      </ul> 
     </div> 
    </div> 
</div>

來源

2012-02-23 user1061995

哪裏是你的HTML部分 – 2012-02-23 13:52:26

添加一些HTML代碼，並請提供_minimal_例如，大多數的CSS顯示不會影響的問題，我想的div。 – Sirko 2012-02-23 13:53:23

你可以添加基本的標記，因爲CSS本身並沒有真正意義。同時清潔css來保持相關部分而已。 – 2012-02-23 13:53:31

它很難猜你是尋找什麼..我已經對準通過網站上的鏈接方而#footerContainer在中心 - 你可以檢查它，如果窗口大小超過960px ..嗯，說得夠多了 - 檢查演示

DEMO

來源

2012-02-23 15:59:34

謝謝解決 – user1061995 2012-02-23 16:21:41

不知道你的HTML，但我想這可能是因爲你使用float：留在您的頁腳相關的樣式。

我認爲你不會在居中對齊文本的主要原因是，使用浮在容器（DIV）將讓他們有寬度等於內容，但不是100％。

所以，因爲它已經採取了全尺寸文本對齊（只對行內元素，如鏈接，跨度，投入效果），無法使在中心的內容。

我想這個問題是在這裏：使用浮動：左文本對齊的結合：

#footertext{ 
    float: left; 
    text-align:center; 
}

來源

2012-02-23 14:05:24 kingpin

。不幸的是仍然在右邊。我基本上要在div {#footerconatiner是960像素寬在頁面上居中，在footertext將會最遠的那一刻離開 – user1061995 2012-02-23 14:22:49

– user1061995 2012-02-23 14:24:01

你想這樣的事情？ HTTP：//的jsfiddle。net/rdrzf/ – 2012-02-23 14:26:10

見下與筆記我的CSS。我已經包括了你所需要的最低限度，以獲得我認爲是你想要的效果。（如果你想同時得到#footertext和#footerlinks是在同一條線上，只需添加display:inline到兩個IDS。

#footer { 
    width: 100%; 
} 

#footercontainer{ /* corrected spelling to match HTML id */ 
    width: 960px; 
    margin: 0px auto; /* horizontally centers div */ 
} 

#footertext{ 
    text-align: center; /* horizontally center text */ 
} 

#footerlinks{ 
    text-align: center; /* horizontally center text */ 
} 

#footerlinks ul { 
    list-style: none; /* remove bullets from list */ 
} 
#footerlinks ul li { 
    display: inline; /* make li elements inline */ 
}

來源

2012-02-23 16:02:11 Moses

感謝您的幫助，排序 – user1061995 2012-02-23 16:22:27

股利定心CSS

回答

DEMO

相關問題