Row with a padding that I want to delete

Hi, the elements inside the row have a padding that I need to delete. Why is giving that distance between the button and the limit top of the row?

Hi,

I checked and can see you have added the equal height js script.
Kindly remove it, if you would like to add your button to be the same height, you can try adding min-height

Thanks

Hi There, thank you!

I changed that as you told me, still didn’t solve the original problem all the way

Why is the horizontal alignment doing that?
Also why the distance between each button is like that? How can I change that?

Thank you so much!

Hi Iban,

I’ve been changing it through CSS and has no effect with flex styling, would you mind providing your admin login credentials in the secure note? The only solution I can see is setting its alignment from center to start.

As for spacing, could you try setting the columns max-height tp 50px as well? Like adding this CSS to Columns CSS

$el {
max-height: 50px;
}

Thanks!

Hi thank you
here is the info

Hi Iban,

This is really weird one, I setup the same on my installation copying it and it works okay, the button properly aligns to the top of the column instead of bottom (the current one). And it has the same flex styling, could you try updating your Pro to the latest one first then we’ll check? The problem is the column height and button’s flex styling on that page, but won’t fix regardless of CSS I add.

Thanks!

Still happening after updating the theme.

Some background images also disappeared now when previewing the front page. Check blue section with map background where “what we do”

Please let me know

Hi Iban,

It’s specific to your setup, and upon further investigation. Even without the buttons, the columns still behaves the same and with height and spacing even if it’s empty.

I created a test page, and URL in the secure note. You’ll notice that columns seems have its own size and even the empty columns has (I applied background colors to them to make columns visible). On my installation, empty columns has no dimension.

I’ll continue checking, it’s weird as there is no CSS doing that. Please allow me to deactivate your plugins and please backup your site first.

Thanks!

I just did the backup. Thank you

Let me know

Hello Iban,

I have logged in and check your settings. It turns out that the size of the columns with the unwanted gaps especially in smaller screens is caused by the root font size settings in Pro > Theme Options > Typography.

Please keep in mind that the column height would depend on the height of its contents. In your settings, you are using em. You must realise that 4.3em is equivalent to 68 pixels which would be the default minimum height of the columns.

To resolve your issue, please revert back the settings to px.

Hope this explains it briefly.

Hi, thank you so much!

Not sure still what is the problem. I have used buttons before and I never had this problem.
Can you tell me exactly what I have to do to not have that space between those buttons?

Thank you

Hi Iban,

Those spaces are the column height itself that we were discussing :slight_smile:

I also tried changing the font size and it became too tiny, quite weird. Adding line height with zero value fix it somehow, but the one you have added in builder’s CSS is not working.

*/
body {
    line-height: 0;
}
h1, .h1 {
margin-top: 0em !important;
margin-bottom: 0em !important;
  line-eight:
}

p, .p {

  margin-top: 0em !important;
margin-bottom: 0em !important;
}

It should be like this


body {
    line-height: 0;
}
h1, .h1 {
margin-top: 0em !important;
margin-bottom: 0em !important;
  line-height:0;
}

p, .p {

  margin-top: 0em !important;
margin-bottom: 0em !important;
}

Thanks!

Finally That worked!! I was missing a “0”

Thank you!!

You’re welcome!
We’re glad we were able to help you out.

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