Sibiraj
Sibiraj

Reputation: 4756

Apply linear gradient to background

I have been trying to apply linear gradient to the background, but there are stripes that appear in the middle I'm not getting a smooth gradient, how to get a smooth gradient from top to bottom

MY CSS

-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background: #DADADA;
background-repeat: no-repeat;
background: -webkit-linear-gradient(white, #DADADA);
background: -moz-linear-gradient(white, #DADADA);
background: -ms-linear-gradient(white, #DADADA);
background: -o-linear-gradient(white, #DADADA);

My Fiddle : https://jsfiddle.net/3njyc0xm/

Upvotes: 3

Views: 256

Answers (2)

Gehtnet
Gehtnet

Reputation: 447

In Firefox your example works fine, but I think the "normal" CSS property is needed for some browsers. Just add it with

background: linear-gradient(white, #DADADA);

I edited your fiddle here

Upvotes: 0

Kicsi Viziló
Kicsi Viziló

Reputation: 675

Yes, I think there is a problem with "your" colors. I have tried your code with other colors, and there is no problem.

I have tried your jsfiddle gradient in Firefox and Edge, and it seems that there is no problem with your colors, so maybe there is a Chrome bug, or something.

Upvotes: 1

Related Questions