本文導讀：一個元素在水平方向上所占的長度，由width ,padding ,和margin 決定。這些值中，只有width和margin-left，margin-right可以設為auto，text-align是用於設置或對象中文本的對齊方式。一般情況下我們設置文本對齊方式的時候需要用此屬性進行設置。
margin:0 auto;的意思就是：上下邊界為0，左右根據寬度自適應！這就是水平居中的意思，使用 margin:0px auto; 也是大家在做css div定位時的最常用方法，但是在使用過程中，常有居中不了的情況，下面介紹幾種不居中的情況。
1: 與 margin:100px 混用，導致無法居中。
這種情況下，因為前面設了margin:0px auto; 但是后面又設了margin:100px，這明顯是相矛盾的，不僅如此，如果同時使用了margin:0px auto ; 和 float:left ，也一樣都不生效。
2: 沒有指定DOCTYPE。
DOCTYPE是指定瀏覽器以哪一種標准解析html代碼，如果不指定，極有可能會不生效。
我們常見有人寫html，是直接以<html>開頭的，這種情況，我們只要再加上DOCTYPE頭即可以，最好是直接從dw中新建一個html頭，然后從中再做修改。完整的html頭如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
</head>
<body>
主題內容
</body>
</html>
3:DOCTYPE前還有代碼，導致不生效。
在<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
這一句前加了一個<!-- 說明文字 -->這樣的注釋，也同樣出現了margin:0px auto;無法居中的情況。
4、如果上面的幾種方法還是不能夠居中，則可以用 text-align:center
這是下下之策，如果上面margin:0px auto;用了怎么都不行，那到body中加上text-align:center;吧，如此一下不僅是div,文字也會居中顯示。
然后可以再到細化的css中，把相應容器再設成text-align:left再達到文字靠左的效果。
使用 text-align:center; 居中時不能添加 doctype 聲明，否則將不生效.
5、width、margin-left、margin-right 三個屬性各自設置成 auto 的區別：
三個屬性均未設置為auto
當這三個屬性都未被設置為auto時，margin-right總是會被強制設置為auto。這意味着margin-right會被設置成一個值以使框的七屬性的值的總和達到父元素的width值。
margin-left、margin-right被顯式聲明，width被設置為auto
在這種情況下，width被設置為一個值以達到所需要的總寬度。
margin-left、margin-right設置成auto，width顯式設定。
這樣的話兩個邊界會被設置成各占50％的寬度，即相同的寬度。這樣會使元素在其父元素中居中。
一個邊界顯式設定，另一個邊界和width設置為auto
在這種情況下，設置為auto的邊界會被強制的設置為0。而width則會設置成達到總需求所需要的值。
三個屬性均被設置為auto
在這種情況下，兩個邊界會被設置為0，width設置為最大可能值。
6、margin auto與text-align:center的區別
text-align:center設置為文本或img標簽等一些內聯對象（或與之類似的元素）的居中。margin:0 auto是設置塊元素（或與之類似的元素）的居中。
三種情況需要說明：
一、有朋友在操作的時候，將margin:0 auto;的選擇器混淆了，應該是作用對象，如div，p，而不是body。如果設置：body { margin:0 auto; }將不會達到任何效果，除非你定義body的寬度，那將會讓body內的元素產生位置變化。如我們設置body寬度為500px。對p段落不作任何設置，我們最大化窗口將會看到段落並非處於窗口的最左上角。
二，我們設置段落 p {text-align:center;} 將要實現的並不是段落本身的對齊方式，而是段落內元素居中對齊。
三，我們設置圖片標簽img {margin:0 auto;} ，我們就犯了一個小錯誤，img類於內聯對象，不可以設置圖片img標簽的margin屬性，如果你一定想要設置，那么首先要將它的屬性轉變為塊元素，如下面的代碼：img {display:block; margin:0 auto;}