爲什麼我不能用display：block和width：X來對齊一個元素？

Question

總的n00b問題在這裏（至少到CSS精英）：

爲什麼與兩個display: block;和width值似乎沒有一個元素在一線瀑與其父的財產text-align？也就是說，它似乎總是堅持左派。

Here is a jsFiddle illustrating the issue.

顯然，這必須與CSS規範（我的意思是，如果瀏覽器，Firefox和Opera都在其同意，我很少有疑問）一致;我只是不明白這一點。

Answer 1

文本在150px框內對齊。那是對的。塊元素不會與父級中的文本對齊對齊。

要解決此問題，您需要在.width div上使用display: inline-block或float: right。

編輯：與浮，添加clear: right，以避免它被在同一行上與先前的div

Answer 2

這是因爲你的班級是寬度不是寬度。重命名class block_width，然後在你的css中創建最後一個.block_width，而不是你擁有的.width，它可以工作

Answer 3

<span>與display: inline的元件。文字對齊後跟display: inline的元素。帶有display: block的元素不遵循由浮動對齊的文本對齊方式。

當你只是改變元素的寬度保持內聯，在文本對齊之後，但是當你改變你的顯示來阻止並改變它的寬度時，它的內容假設文本對齊，但是元素不對。我想在你的代碼中的一些顏色來說明這一點;）

http://jsfiddle.net/Z6Twf/3/