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

Question

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;
}

your css looks fine, must be smth. else. Did you check your image for an unwanted stroke? — nowaq, Nov 18 '11 at 07:17
http://www2.picturepush.com/photo/a/6993820/1024/Anonymous/tausta2.png This is the image i am repeating — Henu, Nov 18 '11 at 08:33
and this is how it looks like on the website: http://www5.picturepush.com/photo/a/6993828/1024/Anonymous/screen4.png — Henu, Nov 18 '11 at 08:35
The issue is with your image, there's a gradient and the left side is clearly much lighter. — Wesley Murch, Nov 18 '11 at 08:42

score 0 · Accepted Answer · answered Nov 18 '11 at 08:40

0

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

answered Nov 18 '11 at 08:40

kasimir

1,506
1
20
26

this is not CSS problem. white strokes from ur image – korywka Nov 18 '11 at 08:45
Yes, that is what happens when you repeat it. I edited my answer to stipulate that you have two gradients (e.g. in two ways). You should only have the top-bottom gradient. The left-right gradient causes the effect of the white stroke. – kasimir Nov 18 '11 at 08:46

score 0 · Answer 2 · answered Nov 18 '11 at 08:43

0

enter image description here

ur image gradient more white al left and more dark at right

use 1px width background image to correct this mistake:

enter image description here

answered Nov 18 '11 at 08:43

korywka

7,537
2
26
48

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

2 Answers2