Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
Hello, trying to center 3 text widgets horizontally in my footer. I’ve searched the forums and the suggested CSS codes aren’t working for me.
Hi Christina
Thanks for reaching out.
Is it of any help to center the text within each widget?
If you’d like me to take a look at the CSS you’ve tried, if you’d prefer that route, please, send a link to the related forum thread.
Thanks again.
Andrew,
I want the widgets themselves to be centered, but the text within the widgets to be left aligned.
I achieved this using Page Builder for my home page, but I’m redesigning my site to get rid of the sidebar. I’m putting some of the information that used to be in my side bar into the footer and would like it to appear across my site.
For reference, the site is https://ptoanswers.com
I’ve tried:
Thread: Thread: Center footer widget?
Code I’ve tried:
#footer-widgets .widget {
text-align: center;
}
—> Does nothing
#footer-widgets .widget {
width: 70%!important;
}
—>This one centers all 3 footer widgets in a stack and also centers the text within the widgets.
Thread: Thread: How to center multiple footer widgets?
Code I’ve tried:
#footer-widgets .widget {
width: 25%;
}
—> Does nothing
#footer-widgets .widget {
width: 25% !important;
}
—> Does Nothing
#footer-widgets .widget {
width: 25%;
}
—> Does Nothing
@media (max-width:780px) {
#footer-widgets .widget {
width: 100%;
}
#footer-widgets .widget {
width: 25%;
}
@media (max-width:780px) {
#footer-widgets .widget {
width: 100%;
}
}
—> Does nothing
Thread: Thread: Center allign is not workin on the footer widget
/* Footer */
#pl-w55514c97ce022 .panel-grid-cell .so-panel:last-child {
width: 100%;
}
—> Does nothing
I didn’t understand how to edit the widget’s attributes and set to 100% width, so that was the only suggestion I didn’t try from the threads.
I appreciate your help with this!
At AppearanceWidgetsFooter, are there four widgets there? Is there perhaps a fourth widget that hasn’t been saved so it isn’t outputting?
Yes, there is the cookies banner widget. I hadn’t thought about that.
The footer will automatically divide into columns based on the widget count. Four widgets will result in a width per column of 25%, five widgets will output 20% width per column.
Have you found an alternative method of inserting the cookie banner? The footer looks normal now.
I moved the banner to my header and used this CSS:
#footer-widgets .widget {
width: 100%;
}
The widgets are centered.
How can I get the text to not be centered within the widgets?
Thanks for the update.
You should be able to remove that CSS rule, it isn’t being applied from what I can see, the theme’s 33.33% width per column is active.
The text is left aligned within each widget: https://imgur.com/a/yGEbZFy.