居中無序列表

我遇到問題居中一個水平無序列表，我在一個非常基本的「即將推出」頁面上。您可以按照link to the site查看代碼等等。您會注意到，帶有3個社交圖標的水平列表相對於大標題和電子郵件地址而言並不居中，似乎稍微向右移動。居中無序列表

有關如何解決此問題的任何想法？

2012-11-27 Tiwaz89

@ A先生留置權 - 這真的很難說，它有點兒讓你眼睛不舒服嗎？如果是這樣的話。如何正確對齊我的電子郵件地址？ body元素中的所有文本都應該居中。 – Tiwaz89

我只是看到它與一個規模，哈哈你的ul是對的 –

在您的ul元素上設置padding-left:0;。

這將覆蓋Chrome瀏覽器正在抵消中心位置的默認瀏覽器-webkit-padding-start: 40px;。其他瀏覽器默認值可能有所不同

在谷歌瀏覽器中測試並且解決了這個問題。

2012-11-27 09:47:09 Curt

一個非常快速的修復，謝謝。實際上感到尷尬不得不用這樣一個基本的修復問一個問題哈哈。爲什麼在第一個地方應用了填充？ – Tiwaz89

也許這是因爲默認情況下，某些填充應用於li項目以將其「縮進」一點點？ – Tiwaz89

@DeanGrobler如果您使用Google Chrome Inspector或FireBug等，您可以看到'-webkit-padding-start：40px;'被瀏覽器應用於'ul'元素。設置'padding-left：0;'會覆蓋這個。 – Curt

刪除.social_list元素的左填充。

.social_list { 
    padding: 0; 
}

螢火蟲使得搞清楚這種問題出來容易得多，當您檢查DOM它會告訴你對元件造成的空白和邊距。

2012-11-27 09:50:55

非常感謝，現在感覺很愚蠢lol。 – Tiwaz89

@Curt答案是正確的，但你需要重新設置元素，你實際上是面臨着因爲它

使用此重置瀏覽器默認情況下，我總是用這個來代替CSS Reset樣式..

這個問題

* { 
    padding: 0; 
    margin: 0; 
}

比你並不需要聲明padding-left: 0;爲每次你的網頁上使用ul，因爲瀏覽器設置某些元素的默認樣式，因此你正面臨這個問題

2012-11-27 09:54:07

非常好，謝謝！ :) – Tiwaz89

@DeanGrobler同時搜索CSS Reset on google;） –

回答