Change border color of inputs when they are active


Topic: Change border color of inputs when they are active

Zecchini asked 2 years ago

Expected behavior

I would like to change all inputs border color easily (datepicker, textarea, text, select, ...).

Changing the border color of inputs is a basic modification that have to be easier.

Actual behavior

It's wrongly displayed when I use the CSS rules previously advised by you : label is crossed by a border, the CSS rule doesn't apply for every type of input doesn't work for select input, ...

Resources (screenshots, code snippets etc.)

Changing border color of inputs isn't working anymore (you explained it for 3.X versions, not working in 4.X versions).

Exemple for 3.10 (snippet by you) : https://mdbootstrap.com/snippets/standard/m-duszak/3631331

Exemple for 4.0 (same snippet with 4.0 version by me) : https://mdbootstrap.com/snippets/standard/zecchini/4023202

Same problem as : https://mdbootstrap.com/support/standard/change-focus-color-to-inputs-and-textareas-in-mdb5/

Thank you for your time


Grzegorz Bujański staff answered 2 years ago

Check out this snippet: https://mdbootstrap.com/snippets/standard/grzegorz-bujanski/4031693#css-tab-view

I removed the styles that added a line that crossed the label and changed the box-shadow which left a blue line around the border. I also added select and selectors necessary to change border and label


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB Standard
  • MDB Version: MDB5 4.0.0
  • Device: PC
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: Yes
Tags