Change Checkbox Size in Angular Material Selection List

Issue

Is it possible to change the size of the checkbox in an Angular Material Selection List? I’ve tried changing the size of the mat-pseudo-checkbox in CSS but that results in the checkmark not being placed properly:

mat-pseudo-checkbox {
  height: 10px;
  width: 10px;
}

Checkmark improperly placed

Is there another selector that I need to adjust to correct this?

Solution

With Angular 7 I succeeded with:

mat-checkbox ::ng-deep .mat-checkbox-inner-container {width: 30px;height: 30px;}

Answered By – bresleveloper

Answer Checked By – Mildred Charles (AngularFixing Admin)

Leave a Reply

Your email address will not be published.