[4.0.0-beta.6] Multiple ion-select components incorrectly displayed

[doender]

When I have multiple ion-select components on a page, for example:

<div>
    <ion-select interface="action-sheet" placeholder="Choose option A">
        <ion-select-option [value]="A1">A1</ion-select-option>
        <ion-select-option [value]="A2">A2</ion-select-option>
    </ion-select>
    <ion-select interface="action-sheet" placeholder="Choose option B">
        <ion-select-option [value]="B1">B1</ion-select-option>
        <ion-select-option [value]="B2">B2</ion-select-option>
    </ion-select>
</div>

and I click on either one of them, the last ion-select (in this case option B) is always opened; so I cannot set a value for option A.

This happens with a interface types (alert, popover and action sheet).

[doender]

This can be fixed by wrapping each ion-select in an ion-item.
Is this a requirement for ion-select?

[Sprauch]

I have the same issue. While checking the stylesheet I noticed that if you change the style of button.select-cover position from absolute to relative, everything works exactly as intended.

However, as this is an inherited style, I haven't yet found a way to change it in the shadow DOM.
Please let me know if you come up with an alternate solution!

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.