WordPress.org

Ready to get started?Download WordPress

Forums

Contact Form 7
Box Height + Font Size (6 posts)

  1. staz1000
    Member
    Posted 1 year ago #

    How can I increase the height of the boxes in my form and the font inside?

    Is it taken from my theme's style.css? If so what part and how can I separate it??

    http://wordpress.org/extend/plugins/contact-form-7/

  2. Josh Hardman
    Member
    Posted 1 year ago #

    In your main stylesheet you can control any form field height/font by simply using the form input CSS class. For example:

    input{
         width: 300px;
         height: 30px;
         font-size: 15px;
         font-color: #000;
    }

    Bear in mind though, if you are using forms anywhere else on your website, these will also take the same styles. If you want separate form styles, you will need to create a class for the form fields which can be done in the Contact Form 7 admin menu, and simply add the style to your main stylesheet.

  3. staz1000
    Member
    Posted 1 year ago #

    Excellent, thanks for taking the time to explain Josh!

    I had a drop-down box and a comments text area which were unaffected so I added:

    .wpcf7-form-control  {
         font-size: 17px;
    }

    That fixed it.

    Another quick question though, all the boxes use the same font as my theme's apart from the comments text area, how do I make it inherit the font too?

  4. Josh Hardman
    Member
    Posted 1 year ago #

    The text area are not inputs. These are textareas. You can target global text areas using:

    textarea{
    }
  5. staz1000
    Member
    Posted 1 year ago #

    I couldn't get it to work but I added the font-family to the .wpcf7-form-control and that worked.

    Thanks Josh

  6. Petteri111
    Member
    Posted 1 year ago #

    This wont work
    styles.css ?ver=1.0 cant find this file, its not at the server
    can you serch it from my website lindenleaf

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags