+ 1

[SOLVED] Why is linear gradient repeating??

I've experienced this problem a many times; whenever I try to add a linear gradient starting from top to bottom or vice-versa, it starts repeating. I want to display only the colors in linear gradient smoothly at one time on the screen but why are they repeating in blocks here? They look so annoying.How to get a rid of this? And I've observed that if I add the degree of the gradient as 90 degree and 270 degree, they work smoothly on the background. But what is wrong with 180 and 360 deg?? 🤔 Can somebody please explain? See this 👇 https://code.sololearn.com/WFZ5euw09666/?ref=app

28th Apr 2022, 1:43 PM
Aurora Borealis
Aurora Borealis - avatar
5 Respuestas
0
You could try min-height: 100vh; to make sure the body covers the full screen
28th Apr 2022, 1:54 PM
Lisa
Lisa - avatar
+ 2
repeat is the default with background-repeat: no-repeat; it will not repeat
28th Apr 2022, 1:47 PM
Lisa
Lisa - avatar
+ 1
Lisa okay, I've set the background-repeat to no-repeat and it stopped repeating. But why is it looking so small? It should be covering the whole background.
28th Apr 2022, 1:51 PM
Aurora Borealis
Aurora Borealis - avatar
+ 1
Yay! Thanks Lisa 😊.It is working properly now. But I still have a question, Why it is not required to do this when we set degree to 90 or 270??
28th Apr 2022, 1:58 PM
Aurora Borealis
Aurora Borealis - avatar
0
use Background-repeat:no-rerepeat;
29th Apr 2022, 5:41 AM
Paul Chirwa
Paul Chirwa - avatar