Footer layout of elements


I am trying to get my footer layout right but cant find the answers on the forum.

Here is the site:

I would like to do 2 things please if you can help me with the CSS to add that would be great!

1 - the 3 social there are in 1 footer widget. I have already added this css to make the widget full width: .footer-widget{width:100%;} but the icons have also got full width padding or are stacked vertically. I would like to change that so they are stacked horizontally, but still centered in the widget across the page, where i can also set the padding between the icons.

2 - the footer menu below it in the next widget - id like to do the same to that as per above, so i have 1 horizontal line of menu items where i can set the padding between the items, and without that horizontal line.

3 - the copyright text underneath it - how do i center that?

thanks very much for you help!


Hey there

  1. this question is related to the social widget plugin you are using, you have 3 widgets inserted in the one place and this is not working, if its possible use all your social media icons in one widget
    2.3 use this css:

#colophon .widget ul li {
display: inline-block;
margin-right: 13px;
#colophon .site-info {
width: 100%;

awesome thank you this worked well!

Can you also tell me how to get rid of those lines underneath the menu items in the footer?

thanks again :slight_smile:

Hi, i have an addition issue - there seems to be a white spacer that appears (on a mobile) just above the footer when i check the public site. this white space doesnt appear in wordpress when i am editing…
Any thoughts?


Good evening

please use this css:

#colophon .widget ul li {
border: none;
@media (max-width: 767px){
.mb-xs-24 {
margin-bottom: 0px;

great thank you this worked on both accounts!

although, now on the mobile view, the footer menu items go onto multiple lines as ive recently added more pages which is fine, but the spacing between the lines of menu items is really big - how do i edit that spacing? ive tried the line-height property but cant get it smaller.

thanks again


lets update this css:

#colophon .widget ul li {
display: inline-block;
margin-right: 30px;
border: none;
margin-bottom: -13px;

and meanwhile, you can do a small favor for me, please rate our theme and support if you like our work :smiley:

perfect! thanks for the help on this - of course will do a review now :slight_smile:

Thank you so much :slight_smile:

Feel free to open new tickets if you need any assistance, its pleasure to work with you
this case is closed