Fields Background Colors were different

  • Resolved madfinn13

    (@madfinn13)


    12 years, 11 months ago

    Hi,

    I am submitting this inquiry in behalf of my employer.

    You see, after doing the usual set-up of contact form 7 and after including it in some of the pages using the shortcode, I noticed that the color of for the Name field (which uses “text”) is different (it adapts to the color of the theme) compared to the colors (white) in the email and phone # (which uses “email” and “tel” respectively).

    See sample here: http://martinrussellinternational.com/the-magician-adelaide-page

    I just want it to have the same color for all the fields. It could be either white or the color of the theme, it really doesn’t matter as long as everything has the same color so as not to make it weird to look at.

    Any help is greatly appreciated.

    Thanks,
    Grace

    http://ww.wp.xz.cn/extend/plugins/contact-form-7/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Neil Murray

    (@buzztone)

    12 years, 11 months ago

    CF7 now uses the new HTML5 input[type=”email”] for email fields and input[type=”text”] for other fields.

    Sounds like the CSS in your current WordPress theme does not cater for this new HTML5 email input field.

    http://contactform7.com/faq/#Why_does_my_email_address_input_field_look_different gives some guidance on how make these fields look the same in your current WordPress theme.

    To change the style of your CF7 forms you would need to edit the CSS style sheets used by your WordPress theme.

    See Styling Contact Form for a general explanation of styling CF7 forms using CSS. If you are not familiar with CSS, this page also includes some links to where you can learn CSS.

    The most common and preferred method is to create a Child Theme and make any necessary additions to the CSS in the child themes style.css only, rather than directly in the themes styles.css. That way you don’t loose your changes when you update the theme.

    Use Firebug or Chrome Dev Tools to examine the HTML and CSS of your CF7 form in detail. Once you understand how the HTML and CSS is configured in your CF7 form, you should be able to see the CSS changes you need to change the appearance of the form to suit your requirements.

    Thread Starter madfinn13

    (@madfinn13)

    12 years, 11 months ago

    @buzztone:

    I really really could not thank you enough for your prompt reply.

    I did solve the issue (with your help) and it now looked very neat and functional.

    Thank you so much! Really. 🙂

    Grace

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Fields Background Colors were different’ is closed to new replies.