0

I simply want to give my html a CSS background image.

I tried setting it to this:

html {background-image: url('/assets/background.jpg')}

which worked on development, but then when assets are compiled into the Public folder, it's no longer the correct path. This:

html {background-image: url('background.jpg')}

doesn't even work on development.

I'm pretty confused because nobody seems to have had this same problem, but it seems like it should be a pretty common one.

Any light shed would be much appreciated.

Suresh Karia
  • 17,550
  • 18
  • 67
  • 85
Joe Morano
  • 1,715
  • 10
  • 50
  • 114

1 Answers1

2

if your folder structure is like

/css
/js
/img

In most cases css and images will be in their separate folders so you need to go back one step by using ../ It means it will go back one folder so the correct CSS property would be,

html {background-image: url('../img/background.jpg')}

This will work in all situation and servers unless you chnage the folder structure.

And if your css and images both are in same folder you can just write

html {background-image: url('background.jpg')}

for more information see this thread : How to go up a level in the src path of a URL in HTML?

CSS- tricks blog - Quick Reminder About File Paths

Community
  • 1
  • 1
Suresh Karia
  • 17,550
  • 18
  • 67
  • 85