Contact Form 7 CSS on input and checkbox fields

  • I’m entering the width of my input fields using:

    #contact li .wpcf7-form-control-wrap input

    But this is also resizing the checkbox I’m using in this form in a bad way:

    greekstonestudios.com/contact

    How do I either set the width to my input fields without affecting the checkbox, or better yet, just correct the checkbox width?

    I’m not a CSS guru, so I’ve been wasting entirely too much time getting this form this far already, this is my last step, thanks!

Viewing 2 replies - 16 through 17 (of 17 total)

  • Well, not sure i should add comments here to the 7months old topic, but i just face the same issue while styling contactform7 to match wordpress theme style, i declare width for the input fields in my css to 350px, and i wanted my phone field to be 200px and i can’t get it done, i just removed the css in my style file, and declare size and maxlength in Contactform’s form generation field as read on contactform site, and it works smoothly as i wanted, still have my own style to the input fields and control the widths of the input fileds as i wanted.

    Hi,

    You might need to play around with getting the final specificity correct but another CSS selector you might try instead of extraneous markup etc would be input[type=”checkbox”].

    https://www.quirksmode.org/css/selector_attributeAdvanced.html

    Hope this helps, Karl

Viewing 2 replies - 16 through 17 (of 17 total)
  • The topic ‘Contact Form 7 CSS on input and checkbox fields’ is closed to new replies.

Tags