mardi 23 juillet 2019

Reposition checkbox check with long label when white-space: normal Angular Material

I have an Angular Material Checkbox with a long label. When I set white-space: normal for the checkbox, it confines the text to an outer div, however, it aligns the checkbox check center left with the text, and I would like to align the checkbox check to top left.

<mat-checkbox color="primary">
    This is a checkbox with a really long label, I want to wrap on new lines, but also want to align the checkbox check to top left, and it defaults to center left.
</mat-checkbox>

This fixes the issue with the text being on a single line, however, results in the checkbox check being aligned center left, and I want to move it to top left.

::ng-deep .mat-checkbox-layout {
   white-space: normal !important;
}

I would like to be able to re-position the checkbox check to top left, instead of the default center left.




Aucun commentaire:

Enregistrer un commentaire