Question

I am trying to write some css rules which should only affect the TextFields in a VAADIN Form. Here an example:

.v-form-seagreen input[type=text]:focus {
background:#f3fced;  
border:solid 2px #D5E3F9;}

The Problem: other text input fields like the ComboBox inherit the style, and I just wish to change the TextField style. How can I achieve that? .v-form-seagreen textfield:focus does not work as I have expected. Thanks for helping.

Answer 1

You should change your css to override class “v-textfield” not the input type.
So something like this should probably work

.v-textfield{
 background:#f3fced;  
 border:solid 2px #D5E3F9;
}

You might have to add the “!Important” if it does not override correctly.