Angular - how to render 3 formControlName onto 1 line?

Question

Currently the code below render as 3 separate lines.

<div fxLayout="column">
    <label>Some Label</label>
    <mat-form-field class="hide-underline" floatLabel="never">
        <input formControlName="elementA" matInput readonly> 
        <input formControlName="elementB" matInput readonly> 
        <input formControlName="elementC" matInput readonly>
    </mat-form-field>
</div>

How could I get to render on one line like: elementA-elementB-elementC instead?

Answer 1

You can set a css like display: flex to the mat-form-field to get them rendered in the same line