WordPress.org

Ready to get started?Download WordPress

Forums

Contact Form 7
[resolved] Email Box is Way Too Long (10 posts)

  1. bjwright11
    Member
    Posted 1 year ago #

    Hi,

    For some reason, since the latest update, my "Email" line on the contact forms shows that it is very long. How do I make it the normal length again like the others?

    website is http://www.todayslocalmedia.com

    Thanks

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

  2. designrox
    Member
    Posted 1 year ago #

    Woah! My email line appears shorter than the rest and the css styles aren't being applied to it. Weird!!! Hope someone answers you. I posted something similar a few minutes ago.

  3. designrox
    Member
    Posted 1 year ago #

    Actually, check this post:

    http://wordpress.org/support/topic/plugin-contact-form-7-style-of-on-field-different?replies=6

    I did what was suggested and it worked for my form. Although I also added "email" to all styles that had text area defined.

  4. bjwright11
    Member
    Posted 1 year ago #

    Thanks for that heads up. I did see that post before and tried it myself, but I don't think I did it the right way. I may be a little confused on what you mean by adding "email" to the styles that had text area.

  5. DoubleDigits
    Member
    Posted 1 year ago #

    The latest update of the plugin changes the input of the email field from text to email. So from looking at your code, add this:

    input[type="text"], input[type="email"], input[type="password"] {

    so it gets the styling of the other inputs.

  6. bjwright11
    Member
    Posted 1 year ago #

    Thanks for the input DoubleDigits. I believe I added it to the spot you told me, but it didn't seem to work. Can you double check that I added in the right place?

  7. DoubleDigits
    Member
    Posted 1 year ago #

    Your current CSS looks like this:

    input[type="text"], input[type="email"], input[type="password"]
    {
    background: #F6FBFE;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    border:1px solid #C7C7C7;
    margin:0 auto;
    }
    input[type="text"], input[type="password"]
    {
    width: 100%;
    padding: 5px 0;
    color: #0366A0 !important;
    margin: 2px 0;
    }

    You should truncate it to this:

    input[type="text"], input[type="email"], input[type="password"]
    {
    width: 100%;
    padding: 5px 0;
    color: #0366A0 !important;
    margin: 2px 0;
    background: #F6FBFE;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    border:1px solid #C7C7C7;
    margin:0 auto;
    }

    The way you had it before, it was only getting half the styling.

  8. bjwright11
    Member
    Posted 1 year ago #

    Ok. I went ahead and replaced the first portion with the second portion. Seems to still be showing a long line in the form.

  9. DoubleDigits
    Member
    Posted 1 year ago #

    Refresh your cache. Looks good on my side.

  10. bjwright11
    Member
    Posted 1 year ago #

    Ah there we go. Awesome. Thank you for the help!

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.