Ionic 3 离子单选按钮显示选项彼此靠近使用 flex答案

【问题标题】：Ionic 3 ionic radio button display options near each other using flexIonic 3 离子单选按钮显示选项彼此靠近使用 flex
【发布时间】：2019-10-01 09:11:03
【问题描述】：

我需要将单选按钮选项放在一起：

<ion-content padding>
    <ion-list radio-group>
        <ion-list-header>
            Auto Manufacturers
        </ion-list-header>
        <ion-item *ngFor="let entry of array">

            <ion-radio (click)="getVal()" slot="start" [value]="entry"></ion-radio>
            <ion-label>&nbsp; {{entry}}</ion-label>
        </ion-item>
    </ion-list>
</ion-content>

我尝试使用 flex 但它不起作用：

display: flex

当前行为是彼此下方的 2 个选项。但是如何使用 flex 将它们彼此靠近显示？

这是stackblitz

【问题讨论】：

标签： css ionic-framework sass ionic3

【解决方案1】：

您也可以使用网格系统来实现：

<ion-content padding>
<ion-list radio-group>
  <ion-list-header>
     Auto Manufacturers
  </ion-list-header>
  <ion-row>
    <ion-col *ngFor="let entry of array">
      <ion-item >
        <ion-radio (click)="getVal()" slot="start" [value]="entry"></ion-radio>
       <ion-label>&nbsp; {{entry}}</ion-label>
      </ion-item>
    </ion-col>
  </ion-row>
</ion-list>
</ion-content>

【讨论】：

请在您的答案中添加参考