在Chrome中使用透明png背景图像的奇怪工件

Question

我试图创建一个带有透明背景的png的模式。它在Firefox和Safari上都可以正常工作，但在Chrome上它会显示一些空格。

重现问题的代码非常简单：

div {
  background: url('http://vps97368.ovh.net/montessori.it/wp-content/themes/montessori/images/pattern-bg.png');
  height: 500px;
}

<div>blabla</div>

我已经创建了一支笔来展示它：http://codepen.io/anon/pen/RPGOyx

模式应该显示简单的平行对角线，但在Chrome上我看到它们是这样的：

我在视网膜显示屏上遇到问题。不确定其他人。

Answer 1

使图像更大。我用了25x25这个：

http://codepen.io/anon/pen/BNmVXQ

div {
  background: url('https://s3-us-west-1.amazonaws.com/haven-images/pattern-bg.png');
  height: 500px;
}