Radio button doesn't show on Chrome

Ionic Framework ionic-v3
1

I have two radio buttons on a page, and I can’t see them correctly. Here is my code:

<div radio-group>
    <div class="check-item" *ngFor="let answer of quiz.choices;let i=index">
        <ion-radio (ionSelect)="setAnswer(i)"></ion-radio>
        <ion-label>{{ answer.text }}</ion-label>
    </div>
</div>

And here is how I see them: http://puu.sh/v92Dq/9b1e306b6d.png
This is responsive mobile version - desktop app.

Thanks

2

When I tried your code in plunker it’s working: http://plnkr.co/edit/Lrh8zXHA8jatCDgBx5JI?p=preview

You can also implement the radio buttons with ngModel like in the doc: https://ionicframework.com/docs/nightly/api/components/radio/RadioButton/

Here is a working plunker that way: http://plnkr.co/edit/vAZCFGp7czwegJbaxCgm?p=preview

3

Hi again haha! :slight_smile: I added a class call radio-md, I don’t know why but in mobile the radio wasn’t showing properly, but adding this class solves the problem! Thanks for your time!

1 Like