30px global padding of stretched rows – adjust to 50px?

Open 7 replies pluginplugin-page-builderquestion
Chris Dawson
Started · Latest reply by Andrew Misplon

Hi, i’m using ‘full width’ rows, and there seems to be a global 30px padding/margin applied to the rows. Is there a way to change this to 50px (but keeping at 30px on mobile/under say 800px viewport)? I can’t seem to target/override this 30px with CSS alone.
This is in the inspector:

element.style {
margin-left: -30px;
margin-right: -30px;
padding-left: 30px;
padding-right: 30px;

on class=”siteorigin-panels-stretch panel-row-style panel-row-style-for-24-0″

Thanks

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

Need fast email support? Get SiteOrigin Premium

Replies

7
  1. Andrew Misplon Staff

    Hi Chris

    Thanks for posting.

    You can try adjusting the default layout values at SettingsPage BuilderLayout. See the Row/Widget Bottom Margin setting.

    Andrew

  2. Chris Dawson

    Hi, thanks, I’ve tried that but it doesn’t control the LEFT and RIGHT padding. See the element.style 30px settings above that I see in inspector – it’s those I want to change.

  3. Andrew Misplon Staff

    Hi Chris

    If the row is full-width, the negative margins should be dynamic based on your screen width. If you send a link to the page concerned I can take a closer look. Thanks.

  4. Chris Dawson

    Hi Andrew,
    thanks,
    here's screenshot showing the issue. the theme header i've customised to have a 50px L and R padding. the siteorigin "stretch rows" have
    30px paddings L and R and i'd like to get these to be 50px to match
    (when viewport is above 800px, below that i'd like to stick to 30px padding L and R to maximise space)
    https://nsa25.tallhatdev.co.uk/paddingmargin-issue-siteorigin.png

    live site dev is same as above without the png (just put in the co.uk part)

    thanks chris

  5. Andrew Misplon Staff

    Thanks, Chris. As far as I’m aware the value in full-width situations is pulled from the theme which is setting 30px. Please try the following at AppearanceCustom CSS or CustomizeAdditional CSS or in your child theme stylesheet:

    @media (max-width: 780px) {
	#main.site-main {
		padding-left: 50px !important
		padding-right: 50px !important;
	}
}
  6. Chris Dawson

    apologies, yes it was .site-main CSS in the theme. i had assumed it was siteorigin parameters. sorry about that!
    many thanks Andrew

  7. Andrew Misplon Staff

    No worries at all; glad we could make progress.

    Cheers

    Andrew

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