周围的镀铬SVG背景奇怪的滚动条 [英] Strange scrollbars around the svg background in chrome

问题描述

我加入SVG文件作为背景的​​问题。似乎一切都还好吧，但在谷歌浏览器我得到SVG的右侧和底部，而不是一个容器strage不活动的滚动条。这是一个问题的结果截图： http://xmages.net/show.php/2812560_strangescrollbars -jpg.html

I have a problem adding an svg file as a background. Everything seems allright, but in Google Chrome I get strage inactive scrollbars on the right and bottom of svg, not a container. Here is screenshot of a problem result: http://xmages.net/show.php/2812560_strangescrollbars-jpg.html

这里来的CSS的一部分

And here comes the part of css

#container>footer {
    width: 1000px;
    margin: -124px auto 0;
    padding-top: 221px;
    background: transparent url("../img/footerBackground.png") no-repeat 42px 0;
}
.backgroundsize.svg  #container>footer {
    background: transparent url("../img/vector/footerBackground.svg") no-repeat 42px 0;
    background-size:  553px 166px;
}

我不知道哪里他们来自何方。任何帮助吗？

I have no idea where does them come from. Any help?

推荐答案

看看用​​任何文本编辑器原来的SVG文件中。如果你有一半放置在像素的任何固定点，将其移动到最近像素。当您导出SVG，确保文档的尺寸是圆的像素（例如：100像素），还不到一半像素（例如100,49px）。

Look inside the original svg file with any text-editor. If you have any anchor points placed on half pixel, move them to the closest pixel. When you export the SVG, make sure the size of the document is round pixel (ex: 100px), not half pixel (ex 100,49px).

的问题是，如果你有靠近该文件的边缘半象素锚点一个文件，webkit的将其四舍五入到最接近的象素，并因此认为你有文档外锚点，并且将创建固定的滚动条。

The problem is that if you have a document with half pixel anchor point near the edge of the file, webkit will round it to the closest pixel, and thus think that you have anchor points outside the document, and that will create the fixed scrollbar.

这篇关于周围的镀铬SVG背景奇怪的滚动条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！