Contact Form field colour options
Hi
I've just made our site live http://www.berlin-themusical.com/. I have two contact forms, one at the bottom of the home page on a dark background image, the other on a contact us page with a light background. I therefore have added a new class on each form to handle the colours. I'm trying to adjust the colour of the home page form/focus text colour but whatever I try it won't allow the text colour attribute to work, whilst border does, here is some of the .css. Is there something else I need to do?
.cf-contactus input.wpcf7-form-control.wpcf7-text, .cf-contactus textarea.wpcf7-form-control.wpcf7-textarea { background-color:transparent; border:1px black solid; color:#000 !important; }
.cf-home input.wpcf7-form-control.wpcf7-text, .cf-home textarea.wpcf7-form-control.wpcf7-textarea { background-color:transparent; border:1px white solid; color:#F7F7F7 !important; }
input[type=text]:focus, input[type="email"]:focus, textarea:focus, select:focus {
background-color:#ffffff !important;
border-color: #cf3a3a !important;
color: #000000 !important;
}
.cf-home input[type=text]:focus, .cf-home input[type="email"]:focus, .cf-home textarea:focus, .cf-home select:focus {
background-color:#ffffff !important;
border-color: #cf3a3a !important;
color: #000000 !important; }
I've just made our site live http://www.berlin-themusical.com/. I have two contact forms, one at the bottom of the home page on a dark background image, the other on a contact us page with a light background. I therefore have added a new class on each form to handle the colours. I'm trying to adjust the colour of the home page form/focus text colour but whatever I try it won't allow the text colour attribute to work, whilst border does, here is some of the .css. Is there something else I need to do?
.cf-contactus input.wpcf7-form-control.wpcf7-text, .cf-contactus textarea.wpcf7-form-control.wpcf7-textarea { background-color:transparent; border:1px black solid; color:#000 !important; }
.cf-home input.wpcf7-form-control.wpcf7-text, .cf-home textarea.wpcf7-form-control.wpcf7-textarea { background-color:transparent; border:1px white solid; color:#F7F7F7 !important; }
input[type=text]:focus, input[type="email"]:focus, textarea:focus, select:focus {
background-color:#ffffff !important;
border-color: #cf3a3a !important;
color: #000000 !important;
}
.cf-home input[type=text]:focus, .cf-home input[type="email"]:focus, .cf-home textarea:focus, .cf-home select:focus {
background-color:#ffffff !important;
border-color: #cf3a3a !important;
color: #000000 !important; }
Comments
why you added classes for "forms"? You should define classes for sections inside which forms re and then control their colors. Maybe this is the problem you have.