How do you link images set as backgrounds in your CSS file?
-
04-10-2020 - |
Question
The situation:
My custom CSS files are located inside the web/css directory and the page is accessing these files just fine. I can see my styles in effect as they are being loaded.
The problem:
The only problem I am experiencing is that there are several div blocks that I have set a background image for and these images aren't showing up. I am almost certain this is due to the location structure.
How do I properly reference the images located in my web/images folder to my css file (located in web/css)?
La solution
The proper way to reference the images would be using Unix-style directory symbols: ../images/your-image.png
. Ideally, you'd put styles like this in the HTML head or perhaps inline them. Either way, the ideal would be to output the path using $block->getViewFileUrl()
.