我怎樣才能將我的圖像對齊到div中？

我有一個div意味着包含所說的網站上的所有內容，我嵌入到div的圖像不想居中，我不知道爲什麼？我怎樣才能將我的圖像對齊到div中？

這裏是CSS。

#wrapper { 
width: 1000px; 
margin: 0 auto; 
background-color: #f4f9f1; 
} 

#intro { 
padding-bottom: 10px; 
width:80%; 
margin:10px auto; 
border-bottom: 3px solid #b32230; 
}

前奏的ID給說IMG，它只是浮到div的左邊（ID是包裝），即使我有左，右頁邊距設置爲auto，並不會心？

來源

2014-10-02 Conroy

添加文本對齊：中心爲包裝 – Devin 2014-10-02 19:21:12

如果你想要的任何其他信息，你應該看看這個CSS-訣竅萬物中心的文章。 http://css-tricks.com/centering-css-complete-guide/ – 2014-10-02 19:24:10

與margin: auto;的問題是，它只會中心塊級元素......和img是默認顯示爲inline並遵循文本流（向左）。如果添加display: block它它應該工作：

DEMO

#intro { 
    display: block; 
    padding-bottom: 10px; 
    width:80%; 
    margin:10px auto; 
    border-bottom: 3px solid #b32230; 
}

這樣你就不需要集中對準包裝元素的文本。

但是，如果你想居中包裝的所有inline孩子 - 只是在#wrapper使用text-align:center ...但是，那麼你可能需要有前行的休息時間和圖像後或一些文字可能會在下一個結束他們，將它們趕出中心=）

DEMO

來源

2014-10-02 19:30:03

謝謝，它工作:) – Conroy 2014-10-02 21:07:15

使用text-align: center在主容器：

#wrapper { 
    width: 1000px; 
    margin: 0 auto; 
    background-color: #f4f9f1; 
    text-align: center;/*Add text-align center*/ 
}

來源

2014-10-02 19:21:20

或顯示圖像作爲一個塊，取決於OP的需求 – 2014-10-02 19:30:51

我怎樣才能將我的圖像對齊到div中？

回答

相關問題