Hello,
You can target only that row by its ID. In this case the ID is #pg-58-0. So you would do something like this:
#pg-58-0 .panel-grid-cell section {
padding: yourpadding;
}
The grid class isn’t part of the theme. And the big padding comes because you’re using two sections in that widget, I don’t really understand why. It seems you’re using a services section just for the title.
Some more info about a simple way to find IDs: https://developer.chrome.com/devtools
Interesting. It didn’t work though. The CSS animation in that section also uses the tag services. I’ll try changing that and see what happens.
It didn’t work because you’ve set the horizontal padding to 0, not the vertical one 🙂 80px is the vertical one (both top and bottom).
And I see it’s better now because you made grid a div instead of a section so now the theme doesn’t apply padding to it anymore.
Yes, and I was typing the answer right now haha
I’ve mistaken the padding code.
It’s better now. I think I’ll let it like this, but there’s another thing:
the title “Softwares de Gestão” does not get smaller in smaller screens.
I couldn’t edit the title in the PageBuider (strangely, nor in the Editor). So I copied the following code from the call-to-action section of my site INSIDE the text widget, changing the title name only:
<section id="call-to-action" class="action-area">
<h3 class="widget-title"><span class="wow bounce">Softwares de Gestão</span></h3>
</section>
Somehow, it doesn’t behave the same as the actual call-to-action section. Can you figure this out too?
Thanks again for your support, it’s helping me A-L-O-T!
I don’t get it, you can’t set a title for that text widget?
Sorry vladff, I’m complicating things a lil bit.
Please, look again at my site.
I entered a title for the text widget in the first section (“Softwares de Gestão”), but it does not bounce like the Moesia FP widgets titles. (maybe because it’s not actually a section, am I right?)
How can I edit this part only, so that it functions like the other titles?
Even using the chrome DevTools, I couldn’t make it…
I see. You could probably do it with a bit of jQuery.
jQuery(function($) {
$( "#pgc-58-0-0 .widget-title" ).wrapInner( "<span class='wow bounce animated'></span>");
});
Add it to this plugin: https://ww.wp.xz.cn/plugins/custom-javascript-editor/ or whatever else method you prefer.
It bounces with jquery. But there’s only one thing left. To be like the call-to-action section of my site, I need the title to shrink responsively.
I tried media queries, but it seems i’m helpless with them D:
Can you help me in this too, vladff?
Is this wrong?
@media only screen and (max-width: 600px) {
#pgc-58-0-0 .widget-title {
font-size: 25px;
}
}
@media only screen and (max-width: 499px) {
#pgc-58-0-0 .widget-title {
font-size: 10px;
}
}
(the size number here was test-only, but anyway I saw no change)
And thank you for all your support until now.
You don’t really need that code. You need to go to the main style.css, search for 56px !important and remove !important. It will also be removed in the next version of the theme. After you do that it will behave like the rest of the titles. And if you still want it you can add your own custom font sizes after that.
