Greetings.
I getting some styling bug when i use a google.maps element inside of ion-content
Here is how the header looks on the page without google maps
exactly the same header with gmaps in ion-content:
Full map tab html:
<ion-header>
<ion-navbar>
<nav-header-main [title]="'Map tab'"></nav-header-main>
</ion-navbar>
</ion-header>
<ion-content>
<div #map id="map"></div>
</ion-content>
css:
page-map-main-tab {
.scroll {
height: 100%
}
#map {
width: 100%;
height: 100%;
}
}
Tons of tutorials show map usage exactly in the same way.
Why is in my case a header becoming broken when using google maps in ion-content ?