Search code examples
htmlcsswhitespacebackground-repeat

How to get rid of the white vertical stroke after every repeating background image done with repeat-x value in CSS?


Not really sure why this happens, but if I set my body background image a value of repeat-x, it repeats fine, but adds this white stroke after every repeated image. Can someone tell me why this is? I have never come across this before. Below you can see my CSS.

body {
font-family: Verdana, Helvetica;
margin: 0;
padding: 0;
background: url("themes/base/images/tausta2.png") repeat-x;
color: black;
}

Solution

  • The problem is with your source image. This has a second gradient (top-bottom as well as left-right) in it, if you look closely:

    gradient