錯誤對齊流體/基於百分比的佈局圖像

我有這樣的代碼：http://jsfiddle.net/VV9qJ/但由於某種原因，我似乎無法修復由圖像引起的小像素錯誤。基本上你會注意到一些圖像在其中一些圖像上有一個像素或兩個白色的間隙，而有些則沒有，尤其是當你調整瀏覽器窗口大小時。每個瀏覽器都呈現出白色的空白。錯誤對齊流體/基於百分比的佈局圖像

我的佈局不能有任何漏洞，並且所有內容必須相互緊密，包括瀏覽器窗口。

是否有一種可以確保圖像在不同瀏覽器中始終保持緊密對抗的傻瓜式方法？也許jQuery？我已經做了大量的谷歌搜索，但沒有發現這一點。

還沒有找到解決辦法。我很難相信解決方案不在那裏，任何人都可以提供幫助嗎？

來源

2012-02-22 egr103

除非我不明白什麼是錯的，我似乎無法重現白色間隙的問題，但它聽起來像可能是邊緣或填充問題。

div.smallLink { 
    display: inline-block; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    width: 50%; 
}

您可能還需要設置margin和padding上內.smallLink的img標籤爲0

來源

2012-02-22 12:41:39 SnakeBombs

添加您groupoflink格在下面的代碼

字母間距：-4px;

http://jsfiddle.net/VV9qJ/11/

來源

2012-02-22 13:04:38

那不會改變任何東西!! .. – 2012-02-22 13:49:45

我同意@VivekChandra不能很好地解決我的問題 – egr103 2012-02-22 14:11:02

它刪除了兩個相鄰內嵌塊之間的4px空格（空格）。 – 2012-02-23 05:19:07

你的問題是與類content div中width:100% ..

而DIV軸承類banner也被設置爲100%寬度佔據空間的完整100%，但是當你將100％細分爲50% + 50%發生的情況是它將100％寬度500分成250 + 250分。但是隻有當父母的寬度（因爲其動態）是EVEN NUMBER即，2（n）..

否則，50％的分割不會正確發生，比如說501是可用空間，這意味着div寬度爲100％將佔用501的完整空間 - 但是寬度爲50％的子div將獲得250px並250px留下那1寸的差距，你的注意!! ..

要刪除空白空間給一個background-color，這樣你就可以忽略1px白色空間爬起來！

這心不是克服這一點的最好方法 - 應該有一個CSS方式這我無法想到現在..所以，這裏有一個JS的解決方案..

function load(){ 
var largelink = document.getElementById("largelink"); 
largelink.nextSibling.style.width = largelink.parentNode.offsetWidth-largelink.offsetWidth + "px"; 
} 
window.onload = load; 
window.resize = load;

我。e，父母 - 如果501和第一個孩子有50％將是250，那麼第二個孩子將是501-250 +「px」

僅編輯1套HTML（其他人應該這樣做） - 改變獲取父的ID（其15 501）和largelin（如果它的501 - 這將是250）

<div id="largeLink" class="largeLink">

Havnt測試它..希望工程..

來源

2012-02-22 13:57:25

好的謝謝你的解釋，這很有道理。你知道一個jQuery方法可以修復它，而不僅僅是使用背景顏色嗎？圖像可能會發生變化，並且顏色的範圍會有所不同，因此在某些點上線會顯着。 – egr103 2012-02-22 14:10:05

感謝這@VivekChandra，但不幸的是，這並沒有奏效。白色的空白仍然出現。 Plus ID只能在頁面上使用一次。我認爲會有一種純粹的CSS方式來解決這個問題，但目前還沒有運氣。 – egr103 2012-02-22 17:10:33

錯誤對齊流體/基於百分比的佈局圖像

回答

相關問題