Ik probeer een patroon te maken met een png met een transparante achtergrond. Het werkt prima zowel in Firefox als Safari, maar in Chrome wordt het weergegeven met wat witruimte ertussen.
De code om het probleem te reproduceren is vrij eenvoudig:
div {
background: url('https://vps97368.ovh.net/montessori.it/wp-content/themes/montessori/images/pattern-bg.png');
height: 500px;
}
<div>blabla</div>
En ik heb een pen gemaakt om het te laten zien: http://codepen.io/anon/ pen/RPGOyx
Het patroon zou eenvoudige parallelle diagonale lijnen moeten weergeven, maar in Chrome zie ik ze als volgt:
Ik ervaar het probleem op een retina-display. Niet zeker van anderen.
Antwoord 1
Maak de afbeelding groter. Ik gebruikte 25×25 voor deze:
http://codepen.io/anon/pen/BNmVXQ
div {
background: url('https://s3-us-west-1.amazonaws.com/haven-images/pattern-bg.png');
height: 500px;
}