-
Posts
-
I am trying to change the background colour for the iconboxes on the standard landing page layout (which has 3 icon boxes just under the main slider). I want to change the background colour from the standard greyish colour to an image background of a chalkboard that i have uploaded to media library). I am working locally using Desktop Server so can’t give you a URL to view.
I have managed to get as far as enabling the CSS class adding per element, but now don’t know what to put in Quick CSS to link to the image so it populates the background of the iconbox.Also, how do I make the circular icons for the iconboxes stop shrinking in size and stay centred at the top of each icon box. I want the icons to be the same size as they were when I don’t choose to enclose in a box.
Hi craigriches!
Add this to your custom CSS.
.iconbox.main_color .iconbox_content { background: red !important; }Cheers!
ElliottThanks Elliot, but this is to change background to red. I want to know how to use a chalkboard image uploaded to my media library as I said in the question details. I have already read a forum post about changing background to a colour but want to use an image instead and the exact text to use in the Quick CSS to achieve this.
Hi!
Please use the code as following
.iconbox.main_color .iconbox_content { background-image: url(https://kriesi.at/wp-content/themes/kriesi/images/logo.png); !important; background-size: contain; }Cheers!
YigitThanks, Yigit, that worked!
Now I just need to figure out how to keep the circle icons the same size
“Also, how do I make the circular icons for the iconboxes stop shrinking in size and stay centred at the top of each icon box. I want the icons to be the same size as they were when I don’t choose to enclose in a box.”Hi!
Can you please post the link to your page where you would like to apply the changes?
Cheers!
YigitUnable to do that – As I said in the original question, i am working locally with Desktop Server
Basically want the circular icons the same size as when the iconbox is formatted without a boxed border. For some reason, Enfold shrinks the icon as soon as enclosing a box is selected.
No fancy stuff here, just working with the 3 column landing page layout from the demo.
- You must be logged in to reply to this topic.