Footer’s issue with mobile view
Hello,
I have 4 widgets in my footer, which presents well. I add this code to split my footer in 4 and be able to have this 4 widget side by side, and not above and below.
#footer-widgets .widget:lang(en-GB) {
width: 25%;
}
#footer-widgets .widget:lang(de-DE) {
width: 25%;
}
#footer-widgets .widget:lang(es-ES) {
width: 25%;
}
#footer-widgets .widget:lang(fr-FR) {
width: 25%;
}
However, when I check my website on a mobile or even a tab, widgets are overlapping (text from twitter mostly), and on mobile, the widgets are put one top of each other and they are not using the width screen of the mobile. A quick check on my website will allow you to understand better than my explanations.
If you have a solution to have a nice footer on laptop and on mobile too, that would be great.
Thanks.
Olivier
This is our free support forum. Replies can take several days.
Need fast email support? Get SiteOrigin Premium
Replies
3Hi Olivier
Try changing your Custom CSS to:
@media (min-width: 680px) { #footer-widgets .widget:lang(en-GB) { width: 25%; } #footer-widgets .widget:lang(de-DE) { width: 25%; } #footer-widgets .widget:lang(es-ES) { width: 25%; } #footer-widgets .widget:lang(fr-FR) { width: 25%; } }Let us know how that goes.
Hello Andrew,
Thanks, that worked perfectly!
Super, glad we could help :)
Replies on this thread are closed.
Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.