Change Section Padding On Mobile

Support
#1

I found some topics on the forum but they don’t help me at all. So long story short i have a section that i set to have left and right padding to 250px each, the section has 2 columns with no padding and no margins, on desktop all is fine but the problem is that on mobile the content from from left column is pushed out out the viewscreen to the right, and the content from the right column on the left. Now i did give the section a class and used that class in the custom css section of wordpress by addresing :
@media only screen and (max-width: 768px) {
.custom-class .x-section {
padding: 0px;
}
}

But it doesn’t work. Am i missing something ?

#2

Hi Alexandru,

Thank you for writing in, try updating your custom CSS to this:

@media only screen and (max-width: 768px) {
	.x-section.custom-class {
	padding-left: 0px !important;
	padding-right: 0px !important;
	}
}

If that does not work, please remove the 250px padding you applied. And just set a max-width to your ROW instead.



This has the same effect as you add paddings on the side of the section, but responsive in mobile.

Hope it helps,
Cheers!

Mobile Responsive Setup
#4

Did what you said but the problem now is that my columns overlap …

#5

Hi Alexandru,

Did you remove the 250px left and right padding you applied to the section? Since you’re working on localhost please provide some screenshots so we can understand your issue better.

Thanks,

#6

I had everything on zero, but i solved it by increasing the max witdh to 1200px, think each column had way more content than 600px. Still weird it overlapped instead of being responsive.

#7

Hi Alexandru,

Glad you sorted things out. That columns overlapping issue usually happens if you have a fixed width to your column or row or the elements inside it (or rarely happens lengthy text width no spaces on it). I’m not sure how max-width: 1200px resolve it though, but glad you sorted things out.

If you can provide your page template, we might able to investigate it.

Thanks,

#8

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.