圖片引起垂直對齊的問題

一切都很好，當我把兩個藍色和橙色的div正常TXT元素。但是，當我將圖像放置在橙色div（31px）中時，藍色div中的元素被拉下大約藍色div的一半高度。（附加信息，當徘徊在螢火蟲中的橙色div的html上時，它似乎只有圖像的一半被包含在它內，儘管肉眼看起來很好）。

希望有任何幫助，我仍然有點生鏽箱模型。謝謝。

來源

2008-11-17 RekrowYnapmoc

你可以發佈這個問題的HTML和CSS？ – 2008-11-17 16:57:32

嚴肅的一面評論：http://bancomicsans.com/home.html *請*不要再使用漫畫Sans，甚至更多的是網頁設計。這種字體很爛... :-) – Tomalak 2008-11-17 17:05:14

大聲笑，這不是網頁設計。這是div的msword抽象模型。 – RekrowYnapmoc 2008-11-17 17:05:56

您可能想嘗試將圖像浮動到文本的左側。這樣，文本將坐在圖像旁邊，而不需要定位。例如：

<style> 
div { 
position: absolute; 
border: 1px solid blue; 
} 
div img { 
height: 31px; 
width: 50px; 
float: left; 
} 
</style> 

<div> 
    <img src="myImage.gif"> 
    <p>Lorem ipsum dolor sit amet...</p> 
</div>

通過給你的div容器一些填充和/或圖像的保證金調整佈局，你應該能夠得到完全你後的樣子。祝你好運！

來源

2008-11-17 17:25:56

我不太擅長CSS框，但可以添加：display：inline;到圖像樣式修復porblem？和/或添加邊距：0px;
哦，並且是Quirks模式下的更新渲染，因爲不會使它在Quirks模式下渲染也可以修復一些問題。

編輯
通過特殊模式我的意思是，你的頁面有類似下面的一個（雖然你應該關閉過程中使用corrext DOCTYPE）

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

更多DOCTYPES這裏DOCTYPE聲明： http://htmlhelp.com/tools/validator/doctype.html

來源

2008-11-17 17:00:28

試着浮動兩個interal divs。

float：left;

來源

2008-11-17 17:20:03 adam

圖片引起垂直對齊的問題

回答

相關問題