Line Height

Hi @james377 thank you for using Forminator

Could you please try the following for form labels:

.forminator-custom-form.forminator-design--flat .forminator-label {
    line-height: 50px;    
}

Text area input

.forminator-custom-form-15044.forminator-design--flat .forminator-textarea {
    line-height: 30px
}

Verification label

.forminator-custom-form-15044.forminator-design--flat .forminator-label--validation {
    line-height: 30px;
}

Hope this helps, let us know if you have any further questions.

Regards,

Jorge

I put all of that CSS you sent into the Theme Options Custom CSS, but it didn’t change anything. I found Custom CSS in the individual form itself and I added line height to ALL of the options given and it worked, but it kept the radio buttons in place while the text DID increase in line height. In other words, for example, the CFDb text moved but the radio button next to it stayed in place, thus making the CFDb button turn into the IMDb button.
I changed the line height to all of the options available:
Form
Section Title
Section Subtitle
Field Label
Field Description
Input
Textarea

Trying to delete and not use a form maker plugin I paid for because it’s REALLY bad. On each form, you have 344 different settings you can change on it.

• This reply was modified 5 years, 6 months ago by james377.
• This reply was modified 5 years, 6 months ago by james377.

@james377 thank you for your reply.

Could you please try the following(replace the one I provided first)

.forminator-design--flat .forminator-radio .forminator-radio--design + .forminator-radio--label {
    line-height: 35px;
}

.forminator-custom-form.forminator-design--flat .forminator-radio .forminator-radio--design {
    margin-top: 10px;
}

.forminator-custom-form.forminator-design--flat .forminator-label {
    line-height: 30px;    
}

.forminator-custom-form-15044.forminator-design--flat .forminator-textarea {
    line-height: 30px
}

.forminator-custom-form-15044.forminator-design--flat .forminator-label--validation {
    line-height: 30px;
}

This should fix the radio boxes and labels.

Let us know if it works.

Regards,

Jorge

I pasted all of that new CSS in Theme Options (it’s still in there, if you want to look), but nothing happened. It still looks bad.

Is there a way to center a form on a page without using padding? Not only is it very difficult to get it centered by using the padding settings, but what would look centered on my screen won’t be centered on another because the dimensions would be different.

Thanks,
JL

Hello,
Are you there?

JL

@wpmudev-support9
Jorge disappeared. Do you know the answer to the questions here?

Thanks,
JL

@wpmudev-support9
https://www.leesleyfilms.net/support-test/

(from above) 1. Is there a way to center a form on a page without using padding? Not only is it very difficult to get it centered by using the padding settings, but what would look centered on my screen won’t be centered on another because the dimensions would be different.

(from above) 2. I put all of the CSS you sent into the Theme Options Custom CSS, but it didn’t change anything. I found Custom CSS in the individual form itself and I added line height to ALL of the options given and it worked, but it kept the radio buttons in place while the text DID increase in line height. In other words, for example, the CFDb text moved but the radio button next to it stayed in place, thus making the CFDb button turn into the IMDb button.
I changed the line height to all of the options available:
Form
Section Title
Section Subtitle
Field Label
Field Description
Input
Textarea

Trying to delete and not use a form maker plugin I paid for because it’s REALLY bad. On each form, you have 344 different settings you can change on it.

Hi @james377 I apologize for the delay on this one, it’s not that I dissappeared, there has been an increased number of support requests across our platforms.

Anyway, the code I provided was specifically for flat design style, I see that you now changed it to material design style.

Best option here is to use the built in CSS customization box and try the following CSS:

#forminator-module-15530 .forminator-radio {
    margin-top: 10px;
}

#forminator-module-15530 .forminator-label {
    line-height: 40px;
}

Hope this helps, let us know if you have any further questions.

Hi Jorge,
Thank you for responding. That CSS you gave me changed the line-height to everything except the radio buttons, but that CSS worked only for Flat. More specifically, right now the contact form is set to Flat with that CSS you sent me and it changed everything except for the radio buttons, Material with that CSS you sent me didn’t change anything.

At either rate, the radio buttons are still squashed together.

Click here for images.

The CSS that is set to right now using the Flat design style:
#forminator-module-15530 .forminator-radio {
margin-top: 10px;
}

#forminator-module-15530 .forminator-label {
line-height: 80px;
}

• This reply was modified 5 years, 6 months ago by james377.
• This reply was modified 5 years, 6 months ago by james377.

Hi @james377

Could you please try the following from the Forminator CSS without the form ID?

.forminator-radio {
    margin-top: 20px;
} 

This should be only for the radio button.

Hope this helps, let us know if you have any further questions.

Regards,

Jorge

That did it! Thank you. One other question, if you don’t mind: How can I center the form on the page?

Thank you,
JL

2.
Update: I finally finished the form and put it online, but when I checked the mobile version of it, Google Captcha is missing. Chrome: it’s missing until after I push send, and then an error comes up saying you’re not done filling out the form, but then Google Captcha is there. Safari: Captcha is missing and it doesn’t appear no matter how many times you try to send, it just keeps saying fill out the rest of the form.

Image example on Safari here.

3.
New problem. Please see the image here. Note: This is a “forminator-description,” but there isn’t a “forminator description” under Appearance –> Colors

• This reply was modified 5 years, 6 months ago by james377.

Hello @james377 ,

Update: I finally finished the form and put it online, but when I checked the mobile version of it, Google Captcha is missing. Chrome: it’s missing until after I push send, and then an error comes up saying you’re not done filling out the form, but then Google Captcha is there. Safari: Captcha is missing and it doesn’t appear no matter how many times you try to send, it just keeps saying fill out the rest of the form.

I can see that there are JS errors in browser console on your site. I suggest running a conflict test as shown on the flowchart:
https://premium.wpmudev.org/wp-content/uploads/2015/09/Support-Process-Support-Process.gif
to exclude that something else is breaking captcha.
(make sure that you have a backup of the site before doing any changes)

New problem. Please see the image here. Note: This is a “forminator-description,” but there isn’t a “forminator description” under Appearance –> Colors

There is Description in Fields Basics:

kind regards,
Kasia

So, adjusting the colors (which I already know how to do. Who wouldn’t?) will fix the size of the text and move it over to the left hand side where it’s supposed to be at. Did you even look at the picture I sent?

Also, apparently, all the text will be on the left hand side of the form where it’s supposed to be, but to get the “0/50” countdown text on the left hand side too, I have to write CSS. Is that correct?

Also, your “.forminator-label–helper {}” CSS that comes up when you push “Field Description” in the Custom CSS doesn’t work. I had to figure out what it was. Here’s the picture I took (actually look at the picture please): Link.

• This reply was modified 5 years, 6 months ago by james377.
• This reply was modified 5 years, 6 months ago by james377.