Page 1 of 1

Left/right margin on phone

Posted: 13 Apr 2020, 13:53
by tbp
Hi Karl

I'm back with another question. How can I adjust the left/right margin when viewing the site on a phone (tablet and desktop are OK)? For my taste the margins could be a bit larger.

Thanks,
Thomas

Re: Left/right margin on phone

Posted: 14 Apr 2020, 00:03
by mjau-mjau
What margin are you referring to? You mean the left/right margins for the CONTENT? Or do you mean the margin for galleries? They are assigned differently. Content has a fixed margin, while gallery margins will depend on the SPACE assigned for the specific grid.

Re: Left/right margin on phone

Posted: 14 Apr 2020, 01:50
by tbp
I am referring to the margins for the content pages (text).

Re: Left/right margin on phone

Posted: 14 Apr 2020, 04:38
by mjau-mjau
Try this in Custom CSS:
Code
.context {
  padding: 0 2rem;
}
Default space is .9375rem (15px) inherited from the Foundation framework. In the above example, I have set padding to 0 (top, bottom) and 2rem (32px) left/right.

Re: Left/right margin on phone

Posted: 14 Apr 2020, 04:50
by tbp
Thank you. I added a media query (@media only screen and (max-width: 640px)) so that the margings are only active for small devices such as phones.

Re: Left/right margin on phone

Posted: 14 Apr 2020, 06:20
by mjau-mjau
tbp wrote: Thank you. I added a media query (@media only screen and (max-width: 640px)) so that the margings are only active for small devices such as phones.
Right!