The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Reduce Mobile Padding (Squarespace Site)…

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #295512

    Any help on some CSS code to reduce the padding on the mobile version of my website. An example page:



    Hi, you can try this in your CSS Editor:

    @media all and (max-width: 768px){
         padding-left: 30px !important;
         padding-right: 30px !important;

    Thank yo for the suggestion! That worked, but not quite in the way that I was hoping… this added the padding on the entire page. A better page to view this with would be this one:

    In the Squarespace “design settings” there is an option for “Site Border”, which effects the site similarly to the code you gave me. Then there is another option called “Site Padding”. And this effects the elements on the page.

    So for example on the page above, the black section at the top (which is actually an image being used as the background), if I have the “Site Border” set to 30px you will see a 30x white area around the black “background” section and all the way down the page. But if I keep “Site Border” at 0px but change the “Site Padding” to 30px there will be no white border in the black “background” area but the sections below that , which are just page elements (an image, text, etc) will move in 30px.

    I hope I’m explaining that right.


Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.