How do you link images set as backgrounds in your CSS file?

magento.stackexchange https://magento.stackexchange.com/questions/144523

  •  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)?

Was it helpful?

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().

Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top