Блог

У меня есть некоторые элементы формы, завернутые в макет столбца fxLayout, и я не могу уменьшить вертикальное расстояние между элементами. Уменьшение fxLayoutGap не имеет никакого эффекта. Я добавил некоторые css, которые я нашел здесь на stackoverflow, и это уменьшило высоту элементов за счет уменьшения отступа, но все равно есть больший пробел, чем хотелось бы.

HTML-код:

 <div fxLayout="column" fxLayoutAlign="left left" fxLayoutGap="15px">
                <mat-form-field appearance="outline">
                    <mat-label>MAS:</mat-label>
                    <input matInput type="text" class="LongInput" formControlName="mas">
                </mat-form-field>
                <mat-form-field appearance="outline">
                    <mat-label>Air Vacs:</mat-label>
                    <input matInput type="text" class="LongInput" formControlName="airvac">
                </mat-form-field>
                <mat-form-field appearance="outline">
                    <mat-label>Blow Offs:</mat-label>
                    <input matInput type="text" class="LongInput" formControlName="blowoff">
                </mat-form-field>
            
            </div>
 

CSS

 /*override mat control padding*/
 ::ng-deep .mat-form-field-appearance-outline .mat-form-field-infix {
 padding: 0.75em 0 0.75em 0 !important;
 /*tried gap and margin -- no luck*/
 top: -0.25em;
}
 

Как отмечено в css, я также пробовал gap и margin, но это, похоже, тоже не возымело эффекта. Есть еще какие-нибудь идеи?

Спасибо

Пит