Contact Form 7 problem

[Tlacuatzin]

Hello! I created a form for one of the pages, i put it with the theme’s widget which looks fine in itself, however the form has texts out of the fill boxes that need to be in another color because the form is in a place with a dark background thus those text can’t be read in the current style.

I tried to edit the text color using custom-CSS but the form 7’s class or DIV didn’t work. I tried to find another way to edit the css of that part but failed. Could you help me?

Example of how the text disappears with the background

Thank you.

[Billy Nguyen]

Your background color matches the label text color so you won’t be able to see this text.
Currently, this page is setting the background color to white and the label is still displayed normally: https://prnt.sc/ouLnREP-xBHi

[Tlacuatzin]

Yeah, that’s the problem I would like to override the rule to make the text visible when using a dark background.

[Billy Nguyen]

I have added you a wrap tag to these texts, so you can use the following css to change the text color:

.wpcf7-form label{color: #your-color;
}

[Tlacuatzin]

It worked! Thank you.

[Billy Nguyen]

You are welcome!

Let me know if you need to help and hope you will vote 5* for our theme.

Thanks./

[Tlacuatzin]

Sure, will do! 🙂

If i wanted to edit the style of a different contact form that’s gonna be on a white background how could i distinguish the CSS style of the “voluntario-form” from the other?

[Billy Nguyen]

Each contact form will have its own id to distinguish, so you can rely on this id to style contact forms: https://prnt.sc/COfe9IjG1o5n

Ex:

div#wpcf7-f16229-p285-o1 .wpcf7-form label{
color: #your-color;
}

[Tlacuatzin]

Excellent! Thank you very much.

[Author]

Posts