bug(MatSelectionList): Spacing too large between checkbox / radio when set to togglePosition="before"

[philmayfield]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

15

Description

Using a <mat-selection-list> component, and setting the options with <mat-list-option togglePosition="before"> results in too much space between the toggle and the content. According to the Material spec for lists, the spacing between toggle and content should be 16px. Currently its about 35px all in.

Screenshot from stackblitz:

Screenshot from the Material spec:

Reproduction

StackBlitz link: https://stackblitz.com/edit/v9ccty?file=src%2Fapp%2Flist-selection-example.html

Expected Behavior

There should be a total of 16px of space between the toggle and the content.

Actual Behavior

There is approximately 35px of space between the toggle and the content.

Environment

Angular CLI: 16.2.0
Node: 18.14.0
Package Manager: yarn 3.2.0
OS: darwin arm64

Angular: 16.2.0
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, language-service, localize, material
... material-moment-adapter, platform-browser
... platform-browser-dynamic, router

Package Version

@angular-devkit/architect 0.1602.0
@angular-devkit/build-angular 16.2.0
@angular-devkit/core 16.2.0
@angular-devkit/schematics 16.2.0
@angular-devkit/schematics-cli 16.2.0
@angular/flex-layout 15.0.0-beta.42
@schematics/angular 16.2.0
ng-packagr 16.2.0
rxjs 7.8.1
typescript 5.1.6
zone.js 0.13.1

[AnthonyFr75]

Hello,
If no one is working on it, I can handle this defect.

[omdaCh]

In angular material 17. this worked for me :
.mdc-list-item__start {
margin: 0px !important;
}