0
90
VisualizaçõesMostrar elementos HTML en la misma fila
Busco lograr opciones como
Pero con el código actual, lo obtengo de la siguiente manera:
Cómo obtener las opciones Sí y No una al lado de la otra
A continuación se muestra mi código: Para HTML
<div class="mycustom-radios"> <div class="mycustom-radios__item" *ngFor="let employeeType of employeeTypes"> <input class="mycustom-radios__input" id="e_employeetype" name="what-type-of-employee" type="radio" [value]="employeeType" [(ngModel)]="selectedemployeeType"/> <label class="mycustom-label mycustom-radios__label" for="e_employeeType"> <p>{{employeeType}}</p> </label> </div> </div>Para componente.ts
selectedemployeeType: string; employeeTypes: string[] = ['Yes', 'No'];
·
Santiago Trujillo
3 Respostas
Responde à pergunta0
@¡Empanada! Intente usar la propiedad display:flex CSS, así:
<div style="display:flex"> <div>div block 1</div> <div>div block 2</div> </div>
·
Santiago Trujillo
Relatório
0
Debe aplicar los estilos CSS así.
// use this styling div{ display:flex; align-items:center; } input{ margin-right:5px; } input:last-child{ margin-right:0px; } <div> <!-- nest your angular controls here --> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> <input type="checkbox" /> </div>
·
Santiago Trujillo
Relatório
0
Cambie p a span y aplique display:inline como en el siguiente ejemplo. En el ejemplo, he agregado 2 divs para imitar *ngFor="let employeeType of employeeTypes"
.mycustom-radios__item { display: inline-flex; } <div class="mycustom-radios"> <div class="mycustom-radios__item" *ngFor="let employeeType of employeeTypes"> <input class="mycustom-radios__input" id="e_employeetype" name="what-type-of-employee" type="radio" [value]="employeeType" [(ngModel)]="selectedemployeeType" /> <label class="mycustom-label mycustom-radios__label" for="e_employeeType"> <span>No</span> </label> </div> <div class="mycustom-radios__item" *ngFor="let employeeType of employeeTypes"> <input class="mycustom-radios__input" id="e_employeetype" name="what-type-of-employee" type="radio" [value]="employeeType" [(ngModel)]="selectedemployeeType" /> <label class="mycustom-label mycustom-radios__label" for="e_employeeType"> <span>Yes</span> </label> </div> </div>
·
Santiago Trujillo
Relatório
Responde à pergunta