This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

White space down either side on mobile

Open 3 replies pluginplugin-page-buildertechnical
[email protected]
8 years ago · Last reply by Alex S 8 years ago

Hello,

I have a quick question. The website I am building looks great on desktop, but on pages where I have used page builder, the left and right margins on my phone, are too big. It leaves just a small space for text / images / icons in the middle. How do I make it so that the information spans the width of the device?

http://www.newwebsite.kempandkempcatering.co.uk

Thanks
Anna

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

3
  1. Alex S Staff 8 years, 10 months ago

    Hi Anna,

    You can change this with some custom CSS. If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Just add the following code.

    @media (max-width: 550px) {
	.widget {
		padding: 0 !important;
	}
}

    How does that look?

    You might also need to install the SiteOrigin CSS Editor.

  2. [email protected] 8 years, 10 months ago

    Hi Alex, thanks for the reply. That does seem to help slightly, although putting the padding at 0 meant that it looked odd in a vertical row. I changed it to 15px and it looks OK – still lots of white space around some of the text, but much better than it was. Thanks!

  3. Alex S Staff 8 years, 10 months ago

    Hi Anna,

    Please replace the previously provided CSS with:

    @media (max-width: 550px) {
	.page-gutter, .page-template-page-sidebar-none .entry-content, .widget {
		padding-right: 0 !important;
		padding-left: 0 !important;
	}
}

    How does that look?

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread