Remove Headers and field resize

Hi mpruim,

It looks as if you have managed to remove the labels.
You can make the message text smaller by commenting out line 409 of your theme’s style.css file:

/*font-size: 13px;*/

Meg

Yes, I did figure out how to remove the labels. Thanks for the font fix, that worked.

Can you help me figure out how to make the Name and Email fields the same width?

Thanks for your help!

Oh and I thought of one last question: is there a way to get the submit button to look the same on mobile as it does on the desktop? For some reason it isn’t using the theme styles.

Can you share how you removed the labels. Also, does anyone know how to center my form on my page? I don’t know code but if you give me easy directions I’ll figure it out.

mprium, why not try using the default style sheet that comes with the plugin? All the boxes will then take up 100% of space. You can then reduce the size. This post will help you:

https://www.megnicholas.co.uk/articles/version-4-1-9-supports-bootstrap-3/

Meg

Thanks for your response, Meg. I tried using the default style sheet which helped make the Name field the same width as the Message field, but the Email field is still a different length. I also tried the <div> tag approach to no avail.

Any suggestions?

It’s better to use css to remove the labels rather than hack the plugin:

#cscf label {
     display:none;
 }

Add this to the end of your style.css to set the widths:

#cscf .input-xlarge {
	width:400px;
}

Thanks Meg, this works great on desktop!

My only concern is that the field widths don’t work the same way on mobile (when the screen width gets smaller than about 480 pixels wide). Thoughts on that?

@media (max-width: 767px) {
#cscf .input-xlarge {
	width:100%!important;
}
}

Great plugin. I am having trouble removing the labels:

#cscf label {
display:none;
}

did not work for me. also I really want a way to move the “send message” button to the right of the recaptcha. for some reason none of my css besides the box sizing is working. Any thoughts?

URL: https://opmaword.opmaservices.com/ (it is at the bottom)

Hi there, sorry just noticed your post to this thread.
Please can you start another thread if this is still an issue for you.

Thanks, Meg

Hi Meg,
Not sure if you’re still checking in on this thread. But I’m also trying to remove the headers above each of the form fields. I’d also love to edit the text inside each field and perhaps the “submit” button. Unfortunately, I can’t figure out how to do this, and I didn’t see the answer above.

Thanks!