1

我有这个代码: http: //jsfiddle.net/VV9qJ/但由于某种原因,我似乎无法修复由图像引起的小像素错误。基本上,您会注意到一些图像在其中一些周围有一个像素或两个白色间隙,而有些则没有,尤其是当您调整浏览器窗口的大小时。每个浏览器呈现白色间隙的方式也略有不同。

我的布局不能有任何间隙,所有内容都必须相互紧贴,包括浏览器窗口。

是否有一种万无一失的方法可以确保图像在不同浏览器中始终保持紧密贴合?也许是 jQuery?我已经做了很多谷歌搜索,但没有找到任何东西。

仍然没有找到解决此问题的方法。我很难相信没有解决方案,任何人都可以提供帮助吗?

4

3 回答 3

0

Add following code under your groupoflink div

letter-spacing: -4px;

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

于 2012-02-22T13:04:38.487 回答
0

你的问题是width:100%在类的 div 上content..

虽然承载类的 divbanner也设置为100%width 占据了整个100%空间,但是当您将 100% 细分为50% + 50%正在发生的事情时,它将 100% 宽度划分为 - 500 为 250 + 250 为您的细分。​​但是仅当其父级(因为其动态)采用的宽度为EVEN NUMBER.. 即 2(n) ..时,除法才会正确发生

否则,50% 的分割不会正确发生,比如 501 是可用空间,这意味着 100% 宽度的 div 将占用 501 的完整空间 - 但 50% 宽度的子 div 将获得250px250px留下那个 `您注意到的 1px 间隙!

要删除空白,请给出一个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;​

即,父母 - 如果 501 和第一个孩子 50% 将是 250 因此第二个孩子将是 501-250 + "px"

仅编辑了一组 HTML(您应该对其余部分执行相同操作)- 更改为获取父级(15 它的 501)和 largelin(如果它的 501 - 这将是 250)的 id

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

Havnt测试它..希望它有效..

于 2012-02-22T13:57:25.927 回答
0

除非我不明白出了什么问题,否则我似乎无法重现白色间隙的问题,但听起来它可能是边距或填充问题。

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

您可能还必须将 .smallLink 内的 img 标签上的边距和填充设置为 0。

于 2012-02-22T12:41:39.810 回答