-
Posts
-
hi there, kriesi!
a site i’ve built for a client requires 5 restaurant brands to appear side by side (using avia builder, 1/5 modules). works great! within each section, i have the restaurant brand, followed by a line of four social icons.
however, the icons are all left aligned. this is per the setting. if i used “center align” – they all stack vertically, in the center, of course, not not as desirable.
i looked for a “blank space” icon using the icon element, but couldn’t find one, to help space things out. any ideas on how i can center-align this group of four icons so that they appear centered underneath the logo? i’ve included a link to the test site in the private content.
thanks so much for your help!
Hi charger70!
Try adding this to a codeblock element in the page.
<style type = "text/css"> .av_one_fifth span { margin: 0 4px !important; } </style>Regards,
Elliottelliot – what do you mean, add it “in the page”? to the index.php file?
how about using the custom CSS? i prefer that, as it survives updates to the theme.
i added this part:
.av_one_fifth span { margin: 0 4px !important;to custom CSS, it seems to still not be centering anything.
Hey!
Your icons were all on one line yesterday but now they look bigger and do not fit inside the column. Did you change their size? If you add the CSS to the custom CSS area then it’s going to change stuff on every page of your site which could potentially mess up other pages. If you use a codeblock then it will only be applied to that specific page.
You can use this CSS to move just the first icon to the left a bit.
.av_one_fifth > *:nth-child(2) { margin-left: 10px; }Best regards,
Elliott
- You must be logged in to reply to this topic.