Fullscreen Bg Image not showing on mobile

Viewed 31

Here's my site on github pages: https://anacondazz2.github.io/Personal-Website/. Currently I have w3schools' image as a test thinking that my original image was too large (970kb compared to 30~ for wschools'), however if you visit my site on a phone it still doesn't show.

If you visit this site - https://www.w3schools.com/howto/tryhow_css_fullpage_demo.htm on a phone, the bg image shows.

I've copied the exact code from that site which is

.home {
   position: relative;
   height: 100%;
   background: url(https://www.w3schools.com/howto/img_parallax.jpg) no-repeat fixed center;
   background-size: cover;
}

into my own site, but for some reason it still doesn't work. Been trying to solve this for weeks now, any help is appreciated.

Edit: I've changed the bg image to the original.

1 Answers

You must set width and height properly.

Related