Multiple mat-icon or mat-icon-button as prefix or suffix are displayed in columns

#### Bug:
More than one mat-icon or mat-icon-button as prefix or suffix in a mat-form-field are displayed in columns when appearance is other than 'legacy'.

#### What is the expected behavior?
They should display in row like in 'legacy' appearance.

#### What is the current behavior?
They are displayed in column.

#### What are the steps to reproduce?
https://stackblitz.com/edit/material-multiple-presuffix

#### What is the use-case or motivation for changing an existing behavior?
Behavior is not consistent accros mat-form-field appearances.

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
@angular/material 7.1.0

All browsers.

#### Is there anything else we should know?
I see 2 solutions :
__Solution 1 :__
Remove this two rules :
```
:not(.mat-form-field-appearance-legacy).mat-form-field .mat-form-field-prefix .mat-icon,
:not(.mat-form-field-appearance-legacy).mat-form-field .mat-form-field-suffix .mat-icon {
display: block;
}
:not(.mat-form-field-appearance-legacy).mat-form-field .mat-form-field-prefix .mat-icon-button,
:not(.mat-form-field-appearance-legacy).mat-form-field .mat-form-field-suffix .mat-icon-button {
display: block;
}
```
__Solution 2 :__
Use flexbox for prefix and suffix :
```
.mat-form-field-prefix,
.mat-form-field-suffix {
display: inline-flex;
align-items: center;
}
```

Potentially related issues : #11650, #13094, #13322 & #13592

Beginnen Sie mit der verknüpften StackBlitz-Reproduktion und vergleichen Sie die Darstellung von prefix und suffix von mat-form-field über legacy- und non-legacy-Darstellungen hinweg. Bestätigen Sie, dass mehrere mat-icon- oder mat-icon-button-Elemente in einer Reihe angezeigt werden, und überprüfen Sie, dass das Verhalten über die betroffenen Darstellungen hinweg konsistent ist.

Vom Indexierungsmodell aus dem Issue-Text verfasst.