I used CSS to add a margin globally to all pages for mobile use but now have a white gap on the L & R

I used CSS to add a margin globally to all pages for mobile use but now have a white gap on the L & R.
Under Layout & Design, I set the background color to my Primary / Blue but it’s not filling out those edges. Any ideas on how to correct this issue?

/* Global Margins for mobile pages */
.blog .x-container.max.width.offset,
.archive .x-container.max.width.offset,
.single-post .x-container.max.width.offset,
.x-section {

margin: 0em .5em 0em .5em !important;

}

Hello @MichaelZoz,

Thanks for writing to us.

I would suggest you please set this custom CSS code to the global CSS.

.blog .x-container.max.width.offset, .archive .x-container.max.width.offset, .single-post .x-container.max.width.offset, .x-section {
margin: 0 !important;
} 

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector or you subscribe to One where customization questions are answered.

Hope it helps.
Thanks

so the reply is to add the css that I already added? ok great.

Hi Michael,

Please let us know if you need any further help with this.

Thanks

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.