Brevo form, Padding, Font, Font-Size

[fri]

Hi everyone,

I’m experiencing an issue when trying to adjust some styles of my Brevo form (i take the iFrame), which I have embedded in Elementor. In my HTML code, the padding for several DIV elements is set directly via inline style to 8px, for example:

I would like to change this value to 2px exclusively for the Brevo form (the form with the ID sib-form), without affecting the rest of the website. So far, I have tried the following CSS:

#sib-form > div {
padding-top: 2px !important;
padding-bottom: 2px !important;
}

Unfortunately, this approach hasn’t produced the desired results.

In addition, I want to change the font family used in the form, as I’m not satisfied with the current one. In particular, I don’t like the text in the checkbox at the bottom at all – especially the font height is problematic.

Does anyone have a solution on how I can specifically modify the padding, font family, and the font height in the checkbox? I appreciate any tips!

Best regards,

[Phil56]

Good evening and Welcome !

It seems to me that with the iframe, the possible modifications are those made during the publication of the form on the brevo website

For more freedom, I would choose to import the html code and, why not, also the css file to host it on its own website.

The padding is more for the <input class=" " >

and the margin for the <div class=" " >

example: line 236 of the css (https://sibforms.com/forms/end-form/build/sib-styles.css)

.sib-form .input:first-child,.sib-form .input__affix:first-child {
padding-left: 2px;
}

I hope this was useful to you.

[fri]

Hello,

Thanks for your info. That’s not what I meant, though.

The containers and line spacing are too far apart for me.

The line spacing in the text below (« Klick… ») is also too large for me, and the font is bold – which I don’t want.

The entire font is displayed in Roboto, even though I selected Helvetica when creating the form. This setting isn’t reflected in the HTML file.