谷歌地图上的按钮不适用于Firefox,但适用于Chrome

时间:2018-08-10 15:09:20

标签: html css google-maps google-chrome firefox

我有一个Angular 6项目,其页面带有全屏Google Map(带有Angular Google Map组件),并且在其上面放置了一个按钮以转到另一个页面。

该按钮在Chrome上正常运行,但在Firefox中无法正常运行。

Chrome浏览器:

enter image description here

Firefox:

enter image description here

这是HTML

<button type="button" [routerLink]="hxpCaptureUrL">
<span class="hb hb-md hb-custom hxp-button spin" disabled>Activar Celda</span></button>

<div class="map">
  <agm-map [latitude]="lat" [longitude]="lng" [zoom]="3" [styles]="mapStyles" [streetViewControl]="false"
           [minZoom]="2" [zoomControl]="false" class="height-full width-full">
    <agm-marker *ngFor="let hxp of hxps; let i = index" #marker
                [latitude]="hxp.lat"
                [longitude]="hxp.lng"
                [iconUrl]='{"url": hxp.icon,"scaledSize": {"height": 15, "width": 15}}'
                (markerClick)="markerOnClick(modalDialog, hxp, i)">
    </agm-marker>
  </agm-map>
</div>

该按钮正在使用this CSS library

这是CSS

.map {
  top: 0px !important;
  left: 0px !important;
  z-index: 1;
}

/* General Button Style */
.hxp-button{
  font-family: 'AndaleMono', Fallback, sans-serif !important;
  position: relative;
  display:block;
  background: transparent;
  line-height:60px;
  text-align:center;
  font-size: 0.9rem;
  text-decoration:none;
  top: 35vh;
  margin-left: 10vh;
  z-index: 2;
}

我不知道我在做什么错

0 个答案:

没有答案