背景重复模糊图片的颜色？

Question

我目前正在尝试设计一些Call-to-action按钮，我已经制作了一个动态宽度按钮，它由左右容器构成，然后是一个容纳所有文本的中间容器。

中间的图片是50像素并重复。

我的问题是，当图片大于＆lt; = 50px时，背景图片中的绿色显示正确。当它> 50px（并且背景图片重复）时，绿色似乎改变。

有谁知道我做错了什么？

这是两张显示问题的图片：

模糊的一个：http://d.pr/i/fz2b

正确的一个：http://d.pr/i/cjgp

编辑：

我这样做：

<a href="#">
    <div class="left"></div>
    <div class="middle">Link text here</div>
    <div class="right"></div>
</a>

我在.left和.right中的背景并没有重复。我的背景图片只是在溢出时重复 - 当它溢出时，图片会改变它的绿色。 ： - ）

Answer 1

你没有做错任何事。这是因为Image延伸模糊，而不是尝试在具有适当背景颜色的div中使用png图像

这是一个例子

Fiddle

这是一个简单的HTML

<div class="cont">
<img src="http://www.iconsdb.com/icons/preview/moth-green/right-circular-xxl.png" class="img"/>

如果您有任何疑问，请告诉我