div中的文本和圖像 - 如何正確對齊？

我有一個div內的文字和圖像，我希望文字在圖像的頂部對齊，而不是中間。div中的文本和圖像 - 如何正確對齊？

CSS：

.book1 { 
    width: 100%; 
    overflow: auto; 
} 

.book2 { 
    width: 100%; 
    overflow: auto; 
} 

.book1 img { 
    float: right; 
    width: 150px; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border-radius: 5px; 
}

如何讓我的文字去到div的頂部和圖像的相對不中心？

來源

2012-11-07 user1736049

'{H4的margin-top：0; } .book1 {margin-bottom：1em; }'？此外，我沒有看到HTML中的任何元素與'.book2'類。 – thirtydot

謝謝！如果你提交你的解決方案作爲答案，我會給你正確的答案，因爲你是第一個評論者，併爲我解決了這個問題。謝謝 – user1736049

不客氣。只要保留另一個接受的答案，我不介意。 – thirtydot

它實際上是對齊到頂部。 h4標籤有默認的邊距，所以設置：

h4 { 
    margin-top: 0; 
}

會做的伎倆。

來源

2012-11-07 17:20:36 fanfavorite

.book img { 
    float: right; 
    width: 150px; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border-radius: 5px; 
} 

.book { 
    margin-bottom: 2em; 
    overflow: auto; 
}

演示的jsfiddle：
http://jsfiddle.net/e636q/

來源

2012-11-07 17:21:36 micadelli

聽到你走。添加

h4 { margin-top: 0; } 
.book1 {margin-bottom: 1.5em;}

上.book1額外的保證金有助於分隔開的個別書籍

來源

2012-11-07 17:22:43

div中的文本和圖像 - 如何正確對齊？

回答

相關問題