TL;DR:
If you’re using Contact Form 7, and need to modify any input size by CSS, use “00” as size. it will do the trick 🙂

Hey guys,

In one of my current projects I decided to use Contact Form 7, which is a very nice plugin as long as all you need is a simple, quick mail submission form. It is quite extensible and I saw several awesome extensions for better date support, adding maps to your form etc.

However, in my specific case, I did not choose that plugin for a mailing form, but for registration form, and the reason I decided to use it is that the project i’m on is VERY limited on resources. so even though you should never use CF7 for such purposes, sometimes you gotta do what you gotta do. bummer for me.

One of the most annoying things I had to deal with when using CF7, is the fact they have defaults for their input types, which obviously are hard-coded, and added directly to the HTML, so you cannot change it threw CSS 🙁

I tried putting “0” as size to avoid that, but it seems that someone think it’s not a valid input, so after reading some of its code (here), I noticed that it is possible to use “00” as a valid input!

Of course size=”00″ means nothing, and your sweet CSS can take charge of the size 🙂

Hope that this tip would help anyone…