這次做的專案，客戶說，banner圖的上下之間不要留有空隙，仔細一看才發現，上下竟然都有空隙。審查元素，發現所有的div,img的padding和margin都是0，對於這個間隙究竟是如果產生的真的是找不到原因。
網上查了一下，類似的問題還蠻多的。
解決方法基本是四種：
1.將img設定為block;
這個基本可以解決img和div下方的縫隙問題。
2.設定img的豎直對齊方式
v-align:bottom;
3.設定父div的font-size:0
4.設定外層的div的line-height:0
推薦使用第一種方式。
但是本次專案奇怪的地方在於上下皆有縫隙，開始時，上面的縫隙可以通過margin-top:-10px解決。但是後來改了**結構後，此方式也不行。網上找了很多，亦沒有解決方式。
因此採用定位的方式解決：
設定父元素的position為relative
子元素img的position為absolute;設定top為0，完美解決此問題。
為了避免影響其他布局，設定下div的高度為img的高度。
問題出現的原因依舊沒有找到，只是解決了這個問題。解決問題的方式有很多，不過鬱悶的是常常解決了問題，卻不知道為了是怎樣發生了，不利於日後寫**的過程中去避免這些問題。
備忘,div之間縫隙問題
這兩天在psd to div css的過程中，發現ie系的瀏覽器有乙個比較奇怪的問題，上下兩個相鄰的div之中存在3px的縫隙，具體的描述如下 下面的div 使用的是背景，縱軸重複 具體如圖所示 經過google之後，找到的解決辦法是，找到上面的div中的 所在位置，為其設定屬性style disp...
img與容器下邊界的空隙（縫隙）
問題描述 ie7下 img與div block型別元素 下邊界有距離 或者叫縫隙 空隙 ie7才會有這個問題，ie8下是沒有的。解決方案 法寶一 定義img標籤vertical align bottom，vertical align middle，vertical align top。img 法寶二...
關於div層的間隙, 還有img與div的間隙
今天遇到乙個問題 就是上下兩個層之間有空白間隙 層內放的是 解決方法 找到上面的div中的 所在位置，為其設定屬性style display block 問題解決。或者img下邊有div 中有 設定img div上面的object 其設定屬性style display block 問題ok。disp...