Line Height

Hello @james377 ,

Regarding the message field, you can try also this code:

.forminator-textarea {padding-top: 10px;}

in the Custom CSS in the form settings, like that:

kind regards,
Kasia

Hello @james377 ,

I also noticed that you were trying to paste code into Forminator custom CSS and not like Dimitris advised here https://www.ads-software.com/support/topic/line-height-7/page/2/#post-11708410 into Appearance -> Customize -> Additional CSS

Sorry about the multiple messages ??

kind regards,
Kasia

I found the code you mentioned (your screenshot above). So how do you make the form full width on mobile devices and 35% (in my case) for computers?

Thanks,
JL

Hello @james377 ,

If you found that code you can wrap it with media query like that:

@media screen and (min-width: 480px) {
.forminator-custom-form-15547.forminator-design--material {
    width: 35% !important; }
}

so it won’t affect the mobile screens. And then also add next media query:

@media screen and (max-width: 480px) {
.forminator-custom-form-15547.forminator-design–material {
width: 75% !important;
}
}

that will change the width of the form for only mobile devices. Of course, you can adjust the width to a different value than 75%.
As Dimitris suggested media queries should be in the Appearance -> Customize -> Additional CSS.

kind regards,
Kasia

Got it. It worked for the desktop version, thanks. It doesn’t work for my mobile, though, which means it probably doesn’t work for any mobile phones. Click here to view. The form is off of the screen.

Thanks,
JL

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

Hi @james377,

Have you moved your form or created a new one because it’s no longer loading on the /support-test/ page?

Cheers,
Predrag

Hello,
Support page? We’ve been working on the “Apparition Alert,” page, which you can find here:
https://www.leesleyfilms.net/our-current-project/apparition-alert/

Hi @james377,

Support Test is the page attached to your original post and that’s where I was checking it before.
I checked the form now and it seems that there’s a typo in Dimitris’ second part of code, can you try with this please:

@media screen and (max-width: 480px) {
	.forminator-custom-form-15547.forminator-design--material {
		width: 75% !important;
	}
}

Cheers,
Predrag

That worked, thank you. Can you look at another one for me? It’s the mobile version for the form on this page: click here. That CSS didn’t work for that form, even after I changed the CSS to Flat.

Thanks,
JL

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

Hello @james377

Hope all is well!

Please for each new question create a new thread, as this one is getting quite long and it is hard to track the actual issue.

The CSS didn’t work because it is supposed to work on a certain form with an ID 15547.
To make the form in the last share URL full width, please locate this CSS code and remove it:

.forminator-custom-form-19647.forminator-design--flat {
    width: 75% !important;
}

If the above code required for the Dekstop view, please modify it to look like this:

@media screen and (min-width: 900px) {
.forminator-custom-form-19647.forminator-design--flat {
    width: 75% !important;
}
}

Hope this helps!

Have a good day and take care!

Cheers,
Nastia