0

I'm trying to set up a background-image to cover the whole screen, but it still doesn't cover the whole page, but only the upper part of it. What am I doing wrong?

body {
  background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/104215/launch-day-boom_copy.svg");
  background-repeat: no-repeat;
  background-size: cover;
}
TosT
  • 11
  • 3

1 Answers1

-1

body { background-image: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/104215/launch-day-boom_copy.svg"); min-height: 100vh; /* You must set a specified height / background-position: center; / Center the image / background-repeat: no-repeat; / Do not repeat the image / background-size: cover; / Resize the background image to cover the entire container */## > Heading ## }

Prashant Gaurav
  • 169
  • 1
  • 1
  • 5
  • No. The body element is special cased. A background image applied to it will, by default, apply to the root element instead. There's no need to force a minimum height on it. – Quentin Jan 19 '19 at 19:39
  • @Quentin there is a need in this case ,because of the no-repeat – Temani Afif Jan 19 '19 at 19:57