The Divi Theme comes with an option to set adjust the "content" width of your site. This lets you choose how wide your want your site's content to be (the default is 1080px). However, there is no equivalent option for setting the footer content width on mobile devices – on mobiles your site footer content is fixed at 80% width (with a 10% gap at either side). If you want to change that, here's how:
The following CSS will override Divi's default 80% footer content width on mobiles:
@media only screen and (max-width: 980px) {
#main-footer > .container,
#et-footer-nav > .container,
#footer-bottom > .container {
width: 90% !important;
}
}
Related Post: Adding CSS to the Divi Theme
In this case, I've set the width to 90%, which gives a wider site on mobiles, with less margin on either side. You can of course change this to suit your needs.
This feature is available as an option in Divi Booster 2.6.5 onwards. You'll find it on the Divi Booster settings page, under "Footer > Set footer content width".
Hi, I have problems with social icons. The icons are there (instagram and linkedin), but the links don´t work.
Could you give me support on this matter?
Thanks in advance!
Miguel,
Hi Miguel, it looks like the Whatschat.co widget is (transparently) overlapping the icons and preventing clicks on them. I've just put up a post with some CSS code that I think should fix the problem:
https://divibooster.com/fix-footer-links-not-working-with-whatschat-widget/
Hope it helps!
Dan