Sometimes, Contact Form 7 text boxes go outside the sidebar or they are too wide than required. CSS doesn’t even work while resizing or reducing the text box (input box) sizes of the WordPress plugin Contact Form 7.
I had the same problem and didn’t find a single answer on Google which could solve the problem of the Contact Form 7’s Text Boxes going outside of the Sidebar. After researching a bit, I found a working solution. Here’s it…
Reduce the Size of Contact Form 7 Text Input Boxes
-
Step 1: Log in to your wp-admin
First of all log in to your site’s wp-admin, install the contact form 7 and create a Form if not already did.
-
Step 2: Open the Contact Form to Edit
Click Edit and the form editor will open where you can edit your contact form.
Your screen will look something like the above image when the Edit option is clicked.
Step 3: Do Some Changes in the Code
Add “25/” after text* your-name in the form as shown in the image below.
You can add this “25/” to all or any specific fields of your contact form.
Wrapping it up
If you want your text boxes to be a little smaller or a little larger then you can use “20/” or “30/” respectively.
Any doubts or suggestions are welcomed in the comments.
15 replies on “Reduce (or Resize) Contact Form 7 Text Input Boxes”
Doesnt work
Well, I’m not sure what went wrong. But, it did work for me.
Thanks, appreciate the tip!
Thanks, buddy. Made my day.
i was facing this problem since a week … finally i found solution hear i appreciate your work …. Thanks alot
Glad you liked it.
this doesn’t work i have tried it and the cf7 form your name section on my website is the same size as the rest of the options
It used to work back then. Maybe it doesn’t work after the update.
Doesn’t work
Worked for me, thanks! 🙂
Glad it worked, thanks.
Hi Deepak, Just tried this (April 2021) it works brilliantly! Thank you so much 🙂
Glad it worked for you, Alan.
Bravo ! A good solution for a, usual problem without solution in a lot of forums ! Thanks a lot !
How can you do for “text area” box ? Your super solution works for text, tel mail but not for text area ? Thanks
Glad it worked, Pete.
No, I haven’t figured out yet how to resize text-area box. But once I do, I’ll update.
Thank you.