CSS Background Image using url() Not Displaying

I recently have being following this tutorial on youtube https://www.youtube.com/watch?v=FazgJVnrVuI and I am up to a part where I am adding images (around 1 hour in). I have tried everything I could and still it doesnt show. I would love some help. Thanks 🙂

Here is my code :

css

...

 background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0% rgba(17, 17, 17, 0.6) 100%), url('/images/pic2.jpg');

...

My file directory looks like this

Main folder

Images/

  pic1.svg

  pic2.jpg

  pic3.jpg

html and css all in the main folder.

This error also pops up

invalid property value

>Solution :

I think the issue is both with the URL and linear-gradient or either of them. If your code is in main folder and images are in the images folder then URL should be
url('images/pic2.png'). Also, try to change the linear gradient to test if it works.

background-image: linear-gradient(to right,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%), url('images/pic2.png');

Leave a Reply