Removing padding in Sydney

Hi,

You can manage those widget padding from: Edit page > edit row > row styles > theme > top/bottom padding.

Let me know how it goes.

Thank you,

That helped to get rid of the top/bottom padding but I still can’t get rid of padding on the right/left sides. For example, if I put a background image in one of the widgets that I want to span across the whole page how would I do that?

Hi,

Sorry for late reply. To make the section of your widgets displayed full width, you have to change the row layout of the rows. Please edit page > edit row > row styles > theme > row layout > full width

Helly I have the same issue,

I have row (set to full-width-stretched, top/bottom padding 0) with 2 columns, left a text widget, right a video widget. Top/bottom padding 0 works.
And then I set “padding 0” in the video widget to get rid of the right whitespace, but still has white space on the right (is this a css bug?).

I could fix it via custom css but I wanted to use the build in options, especially to make it easier for non-admins who work with the site.

Thank you

Hi @fantasmo,

Please clarify that you’ve checked the Column Padding in Edit Row > Row Styles (scroll the option to the bottom)

Oha ?? thank you that was it.
Thank you for your help!

I am wanting to remove the padding below the title bar on each of the pages could you help me or show me what I am doing wrong I have the padding set to 0px on everything but every time the setting says 100px my Web page is https://Www.trxctiming.com

I fixed the padding issue i was having but now i am running into another padding problem, Now i would like to shrink the padding around my content area here is my website.

https://trxctiming.com/wp2/track-field/track-field-meet-information/

I am using tablepress in this page but I dont think that is the problem and I have the full-width template selected for the page attributes but I do not like that there is so much space on the right and left of my data. Can anyone help me

Hello @zreece3,

You can use this CSS code to make the content displayed full-width:

.page-id-67 .page-wrap .content-wrapper.container {
    width: 100%;
}

That worked great. Where did you find the page-id for that page? I have a few other pages I would like this to them

Yes, I am using page-id to achieve that.
You can use “Inspect element of the browser to get the page id:
1. Right click your browser then click “inspect” https://prntscr.com/du4cn9
2. Here is the page-id https://prntscr.com/du4cbd

Can I change this code

.page-id-4756 .page-wrap .content-wrapper.container {
width: 90%;
}

so that it would apply for every page? I am guessing that I would need to change something in the .page-id-, Ive tried -all with no success

Hi,

You can just need to change .page-id-4756 to .page

zreece3 please, how did you manage to remove the 100px padding? I dont know where it is anymore, it is not even in the parent theme css file anywhere T.T

thank youu!

@petra47
I went to Appearance and Customize then at the bottom there is an Additional CSS area and I put this information in

@media (min-width:769px) {
.page-wrap .content-wrapper.container {
width: 90%;
}

}

@media (max-width:768px) {

.page-wrap .content-wrapper.container {
width: 100%;
}

}

I broke it down for media breaks as well so if someone was looking at it on a mobile device it would use 100% of the page and then one a computer it would use 90% of the screen. I do not like using px any more because of all of the different sizes %’s have worked better for me. If you want to have the same padding for both devices just put this in

.page-wrap .content-wrapper.container {
width: 100%;
}

and select the width you want