Tagged: iconbox
I am trying the following inside an Iconbox:
Multiple shortcode icons on the same line. Code:
[av_font_icon icon='ue808' font='entypo-fontello' color='#d4b98c' size='20px' position='center'][/av_font_icon]
Ideally, I would like 4 icons next to each other. No matter what I do, it automatically inserts each icon on a new line.
Suggestions?
Hey munck!
Can you post the link to your website and point out the section where you have inserted icons?
Cheers!
Yigit
Link: http://192.185.4.34/~munck/aktivfamilieferie.dk/?page_id=2654
60% down the page. Two golden stars icons
Hi!
You can have them float site wide by adding the following to your Quick CSS in the themes Styling tab or custom.css file:
span.av_font_icon {
float: left;
line-height: 17px;
}
The change in line height is so they don’t take up 2 lines.
Regards,
Devin
Hello
Now the icons are aligned on the same line, thanks.
Two questions remain:
1. How do I center them on the page? (float: center; doesn’t work). I have also tried centering in the Icon box, to no avail.
2. How do I make sure the text the follows go to the next line? No matter what I do in the editor, it stays on the same line as the icons.
Thanks in advance for your help.
See: http://192.185.4.34/~munck/aktivfamilieferie.dk/?page_id=2654
I don’t know of a way to center them together. At that point it would be easier to just use custom css and html or an image instead of the icons.
Hi there, this is probably the most dirty way to workaround this problem. But I just searched up the HTML code and inserted the span code in a pricing table.
I pasted this code and it worked:
<span class='av-icon-char' style='font-size:20px;line-height:20px;' aria-hidden='true' data-av_icon='' data-av_iconfont='all_zhe_icons' ></span>