In this tutorial I am going to show you how to use some custom CSS to center all the text in your website footer specifically on mobile devices. The codes below are different for Squaresapce 7.1 sites and Brine theme sites built on version 7. if you aren’t sure which one you are using, read this article for more information on how to find out, and why it’s so important to know!

Here is the code from the tutorial, specifically for 7.1 sites:

@media only screen and (max-width:640px){
#footer-sections * {
text-align:center
}
}

Here is the code from the tutorial, specifically for Squarespace sites built on the Brine theme:

@media only screen and (max-width:640px){
.Footer * {
text-align:center
}
}

Important info:

✨ There is more than one way to do this! This is just one approach of many because code is super customizable.

🔗 If you want this to happen on a single page, and you aren’t using the block ID for the image, follow the steps in this tutorial on how to install this code on a single page in your Squarespace site.

🙋 Need some help? Visit insidethesquare.co/code-help to see my current support options.