Ripple effect in wrong button inside Google Maps DIV

Ionic Framework ionic-v3
1

I have a page with HTML similar to this:

<ion-content>
  <div id="map">
    <div class="scroll-content">
      <ion-grid>
        <ion-row>
          <ion-col>
            <ion-card>
              <ion-card-header></ion-card-header>
              <ion-card-content>
                <ion-list>
                  <ion-item *ngFor="let item of items.slice(0, 2)">
                    <h2></h2>
                    <button ion-button clear icon-only item-right
                            (click)="">
                      <ion-icon name="close"></ion-icon>
                    </button>
                  </ion-item>
                </ion-list>
              </ion-card-content>
            </ion-card>
          </ion-col>
        </ion-row>
      </ion-grid>
    </div>
  </div>
</ion-content>

When running in an Android device, when I push the first button, the ripple effect is applied in the second button.
When the map DIV is commented, the ripple effect is applied in the correct button.

Anyone has the same problem?

2

Maybe silly question: Why do you have additional Ionic elements inside the Maps div? What should this look like?