Footer widgets styling

[jenwattsdesign]

Hi there, I have 3 footer widgets and have used the following code to add a border between them and a bit of padding. However for some reason the Instagram footer now has a large amount of padding on the left which I need to rectify.
Also is it possible to hide those borders on smaller screen sizes when the footers go into just one column?

Thank you!! Jen

footer.x-colophon .widget {
	border-right: 1px dotted;
display: inline-block;
padding-right: 10px

}

[jade]

Hey Jen,

Thanks for writing in.

Please update the CSS code to:

footer.x-colophon .x-column:not(:last-child) {
    border-right: 1px dotted;
    display: inline-block;
}

Kindly note that since this is a custom code that changes the default behavior/display of the theme, you will be responsible to maintain or update the code in case you require further changes or if the code stops working in future updates.

Here are some related links for further reading:

• Intro to CSS - https://goo.gl/mFuWQT
• How to get CSS selectors - https://goo.gl/BmoH39
• Get Started With Viewing And Changing CSS - https://goo.gl/7xFhDa

Hope this helps.

[jenwattsdesign]

It does!! Perfect, thank you for helping so quickly

[thai]

You’re most welcome.