How can I center the icon at the top of a callout? I was tailoring one of the templates, which had 3 callouts in the middle of the page, each with a picture at the top. I wanted to use icons instead of pictures, and I chose the “Above Heading” option for the icon. But because the overall alignment is Left, the icon aligns left as well.
Is there any way I can align the icon Center while maintaining the left alignment of the text underneath?
You can use the CSS snippet below to center align the icon. This applies to all Callout modules you have.
.fl-callout .fl-icon {
text-align: center;
}
If you want to apply it to certain Callout modules only, simply add a class to the module you’d like this applied to and use the snippet below. In this example, the class added is callout-center-icon.
Thanks Ben. Please bear with me as my CSS skills are limited:-P. I chose the first callout and went into Callout Settings, Advanced, and entered callout-center-icon into the Class window under “CSS Selectors.” Then I added
To my CSS editor. At first that didn’t seem to work, for some reason. But then I went in and did the same thing again (supposedly the definition of insanity?:-P) and it worked!
Thanks! BTW, Chrome works MUCH better than Firefox on the whole caching issue. In fact, I can’t even work with BB using Firefox even if I turn off WP Super Cache and clear the browser cache. Chrome is the only way to go for me (though I have not tried using all other browsers).
