CSS Project, help needed

Hello,

I was working on CSS visual rules, and i tried to give my page a background image.
do i input this code…

background-image: url("https://s3.amazonaws.com/codecademy-content/courses/freelance-1/unit-2/soccer.jpeg");

into the body rule.

but somehow the image appears to be tiled, as shown here:

Is there a way to stop this from happening?

First thing that comes to mind is the background-size property, there are a couple of things you could do with it: https://developer.mozilla.org/en-US/docs/Web/CSS/background-size

2 Likes

I’ll try it out, thanks for the help!

1 Like

It works! Thank you, it helped alot

1 Like

Another more accurate solution is using this:
background-repeat: repeat|repeat-x|repeat-y|no-repeat|initial|inherit;

Using background-repeat: no-repeat; will make sure you don’t have to give your image a size. This way it should also be good for mobile.

2 Likes