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

5 months ago · Last reply by Andrew Misplon 5 months ago

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 5 months, 7 days ago

    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 5 months, 7 days ago

    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 5 months, 7 days ago

    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 5 months, 7 days ago

    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 5 months, 7 days ago

    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 5 months, 7 days ago

    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 5 months, 7 days ago

    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