Topic: Change form label color when in focus
I am trying to change the color of the label and input box underline of the contact us form: https://mdbootstrap.com/components/bootstrap-contact-form/
It seems the color is changed using border-bottom and box-shadow but I am unable to get alter these.
Add comment
Thank you so much, that works great!
I just had to add this to style the message body box as it uses the textarea tag instead of input:
.md-form textarea[type=text]:focus:not([readonly]) + label {
color: #177BA8; }
.md-form textarea[type=text]:focus:not([readonly]) {
box-shadow: 0 1px 0 0 #177BA8;
border-bottom: 1px solid #177BA8; }
Hi,
try this CSS code below:
.md-form input[type=text]:focus:not([readonly]) + label {
color: #CC0000; }
.md-form input[type=text]:focus:not([readonly]) {
box-shadow: 0 1px 0 0 #CC0000;
border-bottom: 1px solid #CC0000; }
Best,
Marta
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Resolved
Specification of the issue
- ForumUser: Free
- Premium support: No
- Technology: General Bootstrap questions
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No
Tags