I am unable to add background image in header class

I want to add an image which I want to fill 100vh height and 100vh width . Also I want it to sit under the navigation bar and other header component. So in header class, I gave background image. But it won’t show up. Can you help me out why Image not showing up:

Here is my gist LINK

You could try double checking the name and the path of the image file. That could be a possible issue.

To make sure your selector is working, set the background to any color like ‘red’ or anything. Just to see if your selector is working.

if your html, css and image are all in the same directory then removing the quotes should fix it. If, however, your css or image are in subdirectories of where your html lives, you’ll want to make sure you correctly path to the image:

background-image: url(…/images/nickcage.jpg); // css and image live in subdorectories

background-image: url(images/nickcage.jpg); // css lives with html but images is a subdirectory

dont use the quotes
that should fix it

In you CSS file change header to .header,so that you use class for better specificity and add a position element in header because z-index won’t work without a position element.

I gave wrong image path. I corrected it now. Thanks a lot for your help

You were right. The problem was image path. I gave wrong path. Thanks a lot for your help

1 Like

I gave wrong path. Thanks for your help