错误对齐流体/基于百分比的布局图像

我有这样的代码：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

错误对齐流体/基于百分比的布局图像

回答

相关问题