Metro Pro – Customizing text input boxes / forms

Community Forums Forums Design Tips and Tricks Metro Pro – Customizing text input boxes / forms

This topic is: not resolved

This topic contains 1 reply, has 1 voice, and was last updated by  joermcd 1 year ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #87969


    Greetings. I have run into one problem with the Metro Pro theme that is driving me absolutely nuts and am hoping that someone can help. My website is

    For my tastes the text input boxes, especially for my contact form (contact form 7), are simply too tall. I am going nuts trying to fix this. At first I thought I had the solution with the following code:

    .wpcf7 input[type=”text”],
    .wpcf7 input[type=”email”],
    .wpcf7-select {
    height: 1px;

    .wpcf7 textarea {
    padding: 0;
    margin: 0;
    font-size: 12px;
    font-size: 1.2rem;

    That got what I wanted in the contact form box height wise. However something is going on with the padding to where I cannot see what I am typing in the “Your Name” and “Your Email” boxes. Strangely enough I didn’t experience that problem in the “Your Message” input box. What am I missing?

    Then I thought of something. All of the text input boxes on the site are too tall for my liking. I saw the following code

    /* Forms
    ——————————————— */
    textarea {
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    box-shadow: 0 0 5px #ddd inset;
    color: #999;
    font-family: ‘Helvetica Neue’, Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-size: 1.4rem;
    padding: 16px;
    padding: 1.6rem;

    So I am thinking that is where I want to make the change so that it is universal for every text input area. Am I correct? If so what should I change so that the text input boxes are just a smidge taller than a line of text and so that there is no padding in the text input box


    Figured it out.

    • This reply was modified 1 year ago by  joermcd.
    • This reply was modified 1 year ago by  joermcd.
Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.