Create Texture by Adding a Subtle Pattern as a Background Image help

Create Texture by Adding a Subtle Pattern as a Background Image help
0.0 0

#1

Tell us what’s happening:

Your code so far


<style>
  body {background: url(https://i.imgur.com/MJAkxbh.png)
    
  }
</style>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:61.0) Gecko/20100101 Firefox/61.0.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/


#2

You’re just missing double quotes around the URL . So just change to:

https://i.imgur.com/MJAkxbh.png

(with double quotes inside the url() call)

./H.B.


#3

Yes, silly mistake, thank you.


#4

I encountered the same problem and found this question.
I have an additional question though: how come the background in the preview changed to the provided pattern even without the double quotes? :confused:


#5

When I put that code without url, I had the same issue, I was thinking, what was the problem i was encountering? The background changed even without the quotes. I don’t have an answer for you but this issue wasted few amount of my time without knowing what was going wrong, I just wanted to share this.


#6

The environment provided for editing in freecodingcamp is perhaps responsible for loading the image prematurely even though the quotes were not available (the syntax mistakes make the test suite fail but are tolerated by the coding environment).
At least, that is my guess.
I’m glad the question and answer is helping people out there!


#7

Thanks for clearing doubts.


#8
body {background: url("https://i.imgur.com/MJAkxbh.png"); }

#9

This may be due to a FCC quirk. It is possible the FCC preview is more flexible than the checking being done for the challenge.


#10

In all honesty you don’t need to use quotes when adding a URL to the background. It’s just that in order to pass this test you have to add them.