Viewing 28 posts - 1 through 28 (of 28 total)
  • Author
  • #885340

    My contact 7 form does not appear as it should.
    Each input has different colors.
    I have tried to have this fixed before but no-one could give a correct way of fixing it.
    The CSS I was given didn’t work.


    Hey Darren,

    Is necessary to check if there are any conflict or custom code causing it, so, share with us your WP credentials to check this better.

    Best regards,
    John Torvik


    Hi John
    Sorry for the delay been busy
    I still have the issue with contact form 7
    I have attached a link to a dropbox image that will show you want I mean.
    The input areas are all different colors.
    Have been given about 3 or 4 different css codes but still not right.


    i see in your css:

    #top .main_color .input-text, #top .main_color input[type="text"], #top .main_color input[type="input"], #top .main_color input[type="password"], #top .main_color input[type="email"], #top .main_color input[type="number"], #top .main_color input[type="url"], #top .main_color input[type="tel"], #top .main_color input[type="search"], #top .main_color textarea, #top .main_color select {
        border-color: #363636;
        background-color: #111111;
        color: #8c8c8c;

    and this is in your vip.entertainment.css ( don’t know where this comes from- it is no enfold including css file)
    or do you have renamed your child-theme?

    change the background-color to your #fff

    try to overwrite these rules on taking the contact-form 7 classes:

    .wpcf7-form .wpcf7-select, 
    .wpcf7-form .wpcf7-text {
    	background-color: #fff !important


    Thanks for helping out @guenni007, did you try that out and did you have any luck with it @darrenvip?

    Best regards,


    Thanks Guenni007
    All sorted.
    Not sure about that css I only ever change css when told to by you guys.
    Thanks for your help very much appreciated.
    have a great day!


    Hi Darren,

    Great, glad you got it working :-)

    Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,


    Can you advise what contact form is compatible with Enfold? Contact 7 doesn’t work properly with this theme.
    All the input fields are different colors, the text in the message box is almost white, the same color as the background as the background so people basically can’t see what they are typing.
    Can’t change any colors because there is about 5 different CSS codes that support has said to put in and changing the CSS doesn’t work anymore.
    I just want a contact form that is wysiwyg and no CSS changes because thats what seems to have messed up contact 7.
    A bit frustrated because it looks like crap on my site.
    Link to my dropbox with a screen shot below


    Hi Darren,

    It looks fine on my end, please see private. How can we reproduce the results you are getting?

    Best regards,


    Look at the link below.
    When you put details in you’ll see how the backgrounds are different colors.


    Hi DarrenVIP,

    The color changes when the input has values, looks like the values are auto-filled by the browser. That is normal behavior.

    Best regards,


    Well can you suggest a contact form that will work in Enfold.
    I have never seen input fields react this way, so I am guessing this plugin is not compatible with Enfold theme.
    I’m sorry I disagree that this is NORMAL.
    In the WordPress forums the opinion from people is a fault with Enfold?
    It seems every time I have any issue with Enfold it never gets fixed?


    It seems every time I have any issue with Enfold it never gets fixed?

    Well Darren that is not realy the truth:
    but i can not confirm to your statement – on all of my Enfold Installations where i do not use the embeded contact form alb element i use CF7.
    And on all those installations it fits well to Enfold. Mostly I use it to have the Google Captcha like you.
    can you post the link to the contact form which causes the troubles?

    Edit: Aha – only Safari shows the autofill option on your contact form. – And these fields after accepting the auto-filled content are with yellow background. And that bothers you ?


    try this in quick css:

    input:-webkit-autofill {
        -webkit-box-shadow: 0 0 0 30px #ffffff inset !important;

    and if you like to influence the font color which is filled in automatically influence both:

    input:-webkit-autofill {
        -webkit-box-shadow: 0 0 0 30px #ffffff inset !important;
        -webkit-text-fill-color: #8c8c8c !important;

    by the way:

    it is a socalled user-agent-style-sheet and has nothing to do with any theme / wordpress



    Thanks for helping out and sharing @guenni007 :-)

    Best regards,


    Thanks for your suggestions but they don’t work.
    I have put a screenshot below and also a link to the page.
    The text is almost invisible.
    I added the CSS as you suggested and it didn’t change anything.
    Getting to the end on my frustration with Contact 7 and enfold as this has been an issue from the first day I installed enfold and there has been around 8 or 9 different changes to CSS and still it is not right.
    My question is, if I delete Contact 7 and remove all CSS will a clean copy of Contact 7 install on my site with no remains of the previous install.
    I will lose around 100 contact 7 forms but the way it looks now is disgusting.


    i’m participant as you so is it the link above to your page?

    By the way : Safari is a stange Browser – you will have to clean cache. If you do not see the developer menu – go to Safari Settings and on Advanced there is a field to mark to show developer tools.

    if you done that the clean cache could be done by: ⌥ ⌘ E

    do you see here any other background colors:

    by the way to influence the selected colors in subject or message field on safari

    ::selection {background-color: #eee; color: #000}

    if it is your site on first topic : see here the simulation on Safari
    click to enlarge:


    7 people spending 4 hours trying to fix this issue.

    Yes we changed the CSS we even removed all CSS changes and took contact 7 back to original install and still 3 different colors in the input area’s, unable to read text in message area. Yes we can change colors in inspect but when make changes to CSS they don’t work.
    Thanks for all your help but this has cost me over $400 and everyone says the same thing…. the theme has issues get a new theme.


    can you send me the url where this is happening. If you don’t like to make it public.
    Send me an e-Mail. My nick has all infos on that – leads to my homepage



    The contact form fields’ background color is now set to “black”. Was this intentional?

    Best regards,


    they are white, doesn’t matter what color you put in the CSS it won’t change from white
    since the last update Enfold has more and more issues.
    Hides pages
    You cant use Social media icons
    avia won’t save templates
    The list goes on and on.
    Think they need to find some new developers



    We would love if you can create a new ticket so we can review the issue and help you out.

    Thank you

    Best regards,


    I want the background color of the input fields of contact-7-form to change from black to white and the font color of these fields to change from white to black..
    I tried Guenni007s suggestion and put the following code in the Quick CSS

    .wpcf7-form .wpcf7-select, 
    .wpcf7-form .wpcf7-text {
    	background-color: #fff !important

    It successfully changed the background of the input fields name, email and subject.
    – it did NOT change the field “your message”
    – I need also to change the font color of the input fields to black
    Any suggestion?

    In the Flashlight theme the following worked

    .text_input, textarea, select, #commentform input{
    border:1px solid #343434;
    background: #fbfbfb;

    It doesn’t work in Enfold.


    • This reply was modified 1 month ago by  bruwa.

    Hi Bruno,

    Could you please give us a link to your website, we need more context to be able to help you.

    Best regards,


    Hi Victoria
    please find the URL in the private content.
    I would like to change the background of all (but only) contact-7-form input fields to white and the font color accordingly to black (white on white background would be difficult to read ;-) …)

    I found this code on the plugin website:

    .wpcf7 input[type="text"],
    .wpcf7 input[type="email"],
    .wpcf7 textarea
        background-color: #fff;
        color: #000;
        width: 50%;

    Unfortunately it did not change anything.


    • This reply was modified 1 month ago by  bruwa.


    Thanks for the update.

    Replace the css code with this:

    #top .main_color .wpcf7-form-control-wrap .input-text, #top .main_color .wpcf7-form-control-wrap input[type='text'], #top .main_color .wpcf7-form-control-wrap input[type='input'], #top .main_color .wpcf7-form-control-wrap input[type='password'], #top .main_color .wpcf7-form-control-wrap input[type='email'], #top .main_color .wpcf7-form-control-wrap input[type='number'], #top .main_color .wpcf7-form-control-wrap input[type='url'], #top .main_color .wpcf7-form-control-wrap input[type='tel'], #top .main_color .wpcf7-form-control-wrap input[type='search'], #top .main_color .wpcf7-form-control-wrap textarea, #top .main_color .wpcf7-form-control-wrap select {
        border-color: #363636;
        background-color: #ffffff;
        color: #000000;

    Best regards,


    Hi Ismael
    I’m afraid I was not aware of your suggestion when I sent the message below (I did not expect it today, so I didn’t refresh the page).
    Now I notice that it has not been sent, instead an error message was displayed – unfortunately I was no longer on this page when it appeared.


    after endless trial and error I eventually managed to find the solution.
    Whenever I added “color: #000” the whole code did no longer work.
    Putting color in a separate code AND putting it before the rest did the trick.

    .wpcf7-form .wpcf7-select, 
    .wpcf7-form .wpcf7-text {
    	color: black !important;
    .wpcf7-form .wpcf7-select, 
    .wpcf7-form .wpcf7-text,
    .wpcf7-form .wpcf7-email,
    .wpcf7-form .wpcf7-textarea {
    	background-color: #f0f0f0 !important

    Best regards,

    • This reply was modified 3 weeks, 6 days ago by  bruwa.

    Hi bruwa,

    Glad you got it working for you! :)

    If you need further assistance please let us know.

    Best regards,

Viewing 28 posts - 1 through 28 (of 28 total)

You must be logged in to reply to this topic.