HI there,
Each field can be a different type of input, so it’s not so straight-forward as to style all fields with one CSS rule. But, for example, .give-input styles a lot of the text inputs.
We do have this tutorial that will help in terms of discovering the various class names. Many find it very useful and instructive.
https://givewp.com/documentation/resources/handling-custom-css-in-wordpress/
Let us know how it goes or if you get stuck on anything in particular.
Thanks!
Thanks for the quick reply.
I tried .give-input but saw no results. Weird.
As for the link, I didn’t find the classes. It just shows a video that shows a button class. I acesses Google dev tools but it’s confusing to understand all the info there. I tried copying and pasting a lot of classes but could not find the one responsible for the input fields. But as you said, there is not a general o e that will change all at once. Will keep tritongo to find the IDs…
Keep in mind the other thing you’ll have to overcome is “specificity” essentially being more specific than our rules. So in the case of the .give-input you’ll need to use this:
form.give-form .form-row input[type=text] {
border-color: purple;
}
The video tries to show that as well.
Hi Matt,
I tried and put this code
form.give-form .form-row input[type=email],
form.give-form .form-row input[type=password],
form.give-form .form-row input[type=tel],
form.give-form .form-row input[type=text],
form.give-form .form-row input[type=url],
form.give-form .form-row select,
form.give-form .form-row textarea, ] {
border-color: purple;
background-color: black
}
It did work in most of the fields. It was missing some fields for credit card info. (card number, cvc and MM/YY). I tried to find the input types on google deve tools but couldnt figure out. Could you please share that? thanks again
Can you point me to a live URL of a form you’re trying to style? That would help me more specifically guide you.
