How can I inject multiple background images in CSS into a rich text block?

How can I inject multiple background images in CSS into a rich text block?

ChanelVDW
Visitor
1 0 0

Hi I am trying to inject a piece of CSS code into a rich text block. I want to insert multiple background images to the same container example:

 

.content-container {background-image: var(--mountain-graphic1), var(--mountain-graphic2);}

 

However, this does not work if I inspect the element on the site it shows that the second var() value returns the section ID before the var value and fails to display any of the background images. Like this:

 

.content-container {background-image: var(--mountain-graphic), #shopify-section-template--xxxxxxxxxxxxxxxxxxx var(--mountain-graphic)};

 

 

Additionally, if I remove the comma and inspect it again, it makes a CSS class without the comma and does not display. As seen here:

 

.content-container {background-image: var(--mountain-graphic) var(--mountain-graphic);}

 

 

Using Dawn theme.

 

Any guidance will be appreciated

Replies 0 (0)