Background gradient

[benchen2020]

Hi
I just started learning. I am having trouble getting the body background in gradient colors. why is it in lines? but how can i make it fill the whole page? what did i miss?

so the CSS for the body is

body
{
background: linear-gradient (45deg, pink, teal);
}

Thank you

[lasjorg]

1. A linear-gradient is set as a background-image.

2. The shorthand background will have background-repeat: repeat set by default.

Technically, all you should need to do is fill the page out with enough content and the repeat pattern should go away. But what you would usually do is set a min-height of 100vh and maybe also remove the repeat using background-repeat: no-repeat; (with the height set the repeat should go away, but there is no harm in setting no-repeat as well).

body {
  background: linear-gradient(45deg, pink, teal);
  background-repeat: no-repeat;
  min-height: 100vh;
  margin: 0;
}