Tengo un componente donde tengo un cuadro de selección y un botón en una fila. En el modo de escritorio funcionan perfectamente bien, pero cuando cambio el tamaño de la pantalla, el diseño se rompe. Lo que quiero es que permanezcan uno al lado del otro en una fila incluso si cambia el tamaño de la pantalla, pero no puedo hacerlo funcionar. ¿Podría alguien mirar mi código que funciona en modo de escritorio y decirme dónde está mi error?

 <div class="row" style="padding-bottom: 10px; padding-left: 40px;"> <form [formGroup]="form"> <item formControlName="type" type="select" placeholder="please select" [selectValues]="options" [labelText]="title"> </item> </form> <div class="col-2 "> <input hidden type="file" #input (change)="selectFile()"> <button class="upload" (click)="input.click()" mat-raised-button type="submit">{{text}} </button> </div> </div>