Contact form control text

For contact form 7 content… how do we control the font size, color, font type, box size such as height and width on individual fields?

Hey,

To edit these things is necessary to add a custom CSS code. If you don`t have CSS skills, you can provide to us your website link with the form in a secure note and our team will give to you the appropriate code to accomplish this.

Thanks!

Please see he secure note that that information.

Hello @jrpetro,

Thanks for writing in!

You can add following CSS to make necessary changes:

form.wpcf7-form p {font-size: 16px; color: #3498db;}

.wpcf7 select, .wpcf7 input[type="text"], .wpcf7 input[type="password"], .wpcf7 input[type="email"], .wpcf7 input[type="url"] {height: 35px;background-color: #ddd;width: 70%;}

.wpcf7-form textarea {background: #ddd;}

Thanks.

There is still unwanted space between my fields I have tried everything and can’t make sense of it at all.

Hi there,

It’s because each of your field has line breaks, and each line breaks are converted to <p></p>. Though I guess, the line breaks are good in your case, it just needs to be smaller. Please change this CSS

form.wpcf7-form p {font-size: 16px; color: #3498db;}

to this

form.wpcf7-form p {font-size: 16px; color: #3498db; margin-bottom: 0; padding: 15px 15px 0px;}

Hope this helps :slight_smile: