Hey,
Thanks for reaching out!
1. You can use this css to reduce the content padding on mobile:
@media (max-width: 768px) {
.content-container.site-container {
padding: 0 10px;
}
}
2. Try adding this to your css:
@media (max-width: 768px) {
.site-top-footer-inner-wrap {
grid-row-gap: 0;
}
}
Hope that helps!
Best,
Hannah
Hi Hannah,
Thank you for the response. Which css files specifically do I edit to add this content?
And do I add both code snippets to the same css file? Does the order matter?
Sorry, I am new at this.
Thank you,
George
Hi @giorgos236
I’m not on the support team, just a happy Kadence user like you, and I spotted your question.
The easiest way to add CSS is to use the WP Customizer >>
> How to Easily Add Custom CSS to Your WordPress Site
> How to Add Custom CSS
Hope that helps, and good luck !
Hi @giorgos236,
Apologies for not clarifying. Both css snippets can be added to your custom css box in Appearance > Customize > Additional CSS.
Best,
Hannah
Hi Hannah,
It worked like a charm, thank you.
George
Hi Hannah,
Following up on that question for padding and margins, is it possible to define a custom page width? Under the Default Page Layout option, I can choose between Narrow and Normal but what about if I want something inbetween? Can I also add some custom code to the Additional CSS option to make that happen?
Thank you again,
George
Hey,
Yes, if you want something inbetween you would need to use custom CSS. If you specify the widths you’re wanting I would be happy to help with that.
Kindly,
Hannah
Hannah,
Any width would work as I need to test different values to identify the optimal one. Maybe try 1000px?
Thank you,
George
Hey George,
You can use css like this:
.content-width-narrow .content-container.site-container, .content-width-narrow .hero-container.site-container {
max-width: 1000px;
}
Hope it’s helpful!
Best,
Hannah
Hannah,
Thank you, it worked great!
George
