How to Apply Fixed Margins

Hello, 

I am trying to lock my SquareSpace site's margins and width so they stay fixed to one size, no matter the browser window/monitor size. An example of the type of locked margins I am hoping to apply to my site can be found here. 

Is there a way to achieve that using SquareSpace design elements or through CSS?

Thank you in advance for your help. 

7 hours ago, jairobrito805 said:

Hello, 

I am trying to lock my SquareSpace site's margins and width so they stay fixed to one size, no matter the browser window/monitor size. An example of the type of locked margins I am hoping to apply to my site can be found here. 

Is there a way to achieve that using SquareSpace design elements or through CSS?

 

Thank you in advance for your help. 

Do you mean setting the these spaces with the same value on desktop and mobile view?

@jairobrito805 use this code  website > Pages > Websites Tools > Custom Css

#page {
    max-width: 1392px;
    margin-left: auto;
    margin-right: auto;
}

/* Optional: To set fixed margins */
body {
    padding-left: 20px; /* Adjust left padding */
    padding-right: 20px; /* Adjust right padding */
}

On 7/17/2024 at 1:02 AM, LoftyDevs-Squarespace said:

@jairobrito805 use this code  website > Pages > Websites Tools > Custom Css

#page {
    max-width: 1392px;
    margin-left: auto;
    margin-right: auto;
}

/* Optional: To set fixed margins */
body {
    padding-left: 20px; /* Adjust left padding */
    padding-right: 20px; /* Adjust right padding */
}

 

This worked, but only for the body of the page. The header still stretches past the 1392px value. Is it possible to lock the header to that width as well?

Thank you for your help and apologies for the late response. 

On 7/16/2024 at 11:11 PM, HoaLT said:

Do you mean setting the these spaces with the same value on desktop and mobile view?

Hi, apologies for the late response. I am primarily concerned with keeping the margins locked on desktop. 

Thank you for your response.