这是我的雪碧:
http://crystalise.tw/crystaliseTW/icons/sprite.png

当我在类似此处的网站上尝试时:http://crystalise.tw

当我使用Firefox和Chromium浏览器时,显示不正确。

可能是什么问题?

这是从我的CSS:

.sprite { background: url('../icons/sprite.png') no-repeat top left; width: 64px; height: 64px;  }
.sprite.blogger { background-position: 0px 0px;  }
.sprite.flickr { background-position: 0px -64px;  }
.sprite.github { background-position: 0px -128px;  }
.sprite.heart { background-position: 0px -192px;  }
.sprite.linkedin { background-position: 0px -256px;  }
.sprite.magnolia { background-position: 0px -320px;  }
.sprite.pinterest { background-position: 0px -384px;  }
.sprite.skype { background-position: 0px -448px;  }
.sprite.so { background-position: 0px -512px;  }
.sprite.youtube_64 { background-position: 0px -576px;  }

最佳答案

问题是您的导航只有700px宽。
您有10个导航项目,每个导航项目的宽度分别为64像素(宽度)+ 22像素(边距),总计860像素(宽),160像素(太大)。
我建议减少nav> div元素的右边距,或增加nav的宽度。
最后,您在导航中的最后一个div可能不需要右边距,因此请使用以下内容:
    导航> div:最后一个孩子{
        右边距:0;
    }

10-05 20:38
查看更多