Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: How do I change the color of a checked mdb radio button?

hans.tielens pro asked 6 years ago


I'm using the mdb radio button and want to change the color of the 'circle' when the radio button is selected, depending on the button that is selected. I tried changing the color of input[type="radio"]:checked, but that doesn't do the trick. How should I do this?

Thanks for your feedback!


ET pro answered 6 years ago


Hi,

this is the css style from mdb.css what changes the radoi colors:

.form-check-input[type="radio"]:checked + label:after,
.form-check-input[type="radio"].with-gap:checked + label:before,
.form-check-input[type="radio"].with-gap:checked + label:after,
label.btn input[type="radio"]:checked + label:after,
label.btn input[type="radio"].with-gap:checked + label:before,
label.btn input[type="radio"].with-gap:checked + label:after {
border: 2px solid #4285f4; }

.form-check-input[type="radio"]:checked + label:after,
.form-check-input[type="radio"].with-gap:checked + label:after,
label.btn input[type="radio"]:checked + label:after,
label.btn input[type="radio"].with-gap:checked + label:after {
background-color: #4285f4; }


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

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.5.10
  • Device: all
  • Browser: All
  • OS: all
  • Provided sample code: No
  • Provided link: No