user5096712
user5096712

Reputation:

Github Pages Background Image Not Showing Up

I am new to website building and recently found out how to use Github Pages to build my own website on a domain I bought from Google Domains.

I have the photo I want to display in the hero section in the photos folder, titled hero.jpg. However, once I commit to GitHub, the photo doesn't show up.

I noticed that I cannot access hero.jpg at my-site.com/photos/hero.jpg so maybe this is the problem.

Could someone please advise me on the proper way to specify the path to images in HTML using the url function? Right now, I'm trying background: url("assets/photos/hero.jpg")

Thanks so much in advance!

Upvotes: 2

Views: 2904

Answers (2)

spaceofmiah
spaceofmiah

Reputation: 238

Though i cannot find the said repository as the link is broken, i got similar issue of displaying background image.

This is my project tree structure

-- assets

   -- images

      -- image.jpg

   -- js

   -- css

      -- styles.css

index.html

My background image didn't display when i did this

background: url("assets/images/image.jpg")

My background image displayed when i did this instead

background: url("../images/image.jpg")

This has worked for me, i hope it works for you.

Upvotes: 1

Daniel Nielson
Daniel Nielson

Reputation: 381

On everything except OSX and Windows paths are case sensitive. Change the .jpg in your CSS to .JPG or rename the file in your git repo.

Upvotes: 0

Related Questions