And call the extra classes below as: specs_container specs_image specs_centered specs_overlay specs_centered specs_text
But when I run it, none of them shows on the page.
Note that I’ll have 3 columns of these snippets next to each other. So there might be something wrong with the coding perhaps. But I place 3 code snippets with 1/3 width to the page builder and then fill them in with the code.
Basically, the goal is to have 3 different images next to each other, with each of them having a title over the image. When hovered, it should fade into a solid color, the title should stay where it is, and more text should appear below the title.
Trouble with Custom CSS and Code Snippet
in CSS
Posted
I’m having trouble adding custom css for an element I’ll use on the products page. The custom Css is as below:
I add this to Custom CSS on theme options.
Then on products page I add a code snippet.
Insert this code there:
And call the extra classes below as: specs_container specs_image specs_centered specs_overlay specs_centered specs_text
But when I run it, none of them shows on the page.
Note that I’ll have 3 columns of these snippets next to each other. So there might be something wrong with the coding perhaps. But I place 3 code snippets with 1/3 width to the page builder and then fill them in with the code.
Basically, the goal is to have 3 different images next to each other, with each of them having a title over the image. When hovered, it should fade into a solid color, the title should stay where it is, and more text should appear below the title.
This is the page the code is live: https://www.arielrider.com/product/demo-copy/
Can anyone help me with this?