Skip to content

Commit 4f43f5c

Browse files
crisbetovivian-hu-zz
authored andcommitted
fix(chips): content not centered vertically on IE in some cases (#13260)
Fixes the chip content not being centered on IE when using a chip avatar. The issue comes from the fact that IE's centering doesn't work if the element has a `min-height`, but not a `height`.
1 parent 15a1ab7 commit 4f43f5c

File tree

1 file changed

+5
-0
lines changed

1 file changed

+5
-0
lines changed

src/lib/chips/chips.scss

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,11 @@ $mat-chip-remove-size: 18px;
4343
cursor: default;
4444
min-height: $mat-chip-min-height;
4545

46+
// Centering the content using flexbox won't work on IE, if we have
47+
// a `min-height` without setting a `height`. This height won't do
48+
// anything since it's less than the minimum set above.
49+
height: 1px;
50+
4651
.mat-chip-remove.mat-icon {
4752
width: $mat-chip-remove-size;
4853
height: $mat-chip-remove-size;

0 commit comments

Comments
 (0)