谷歌地图边界半径未在移动

Question

我有一个直接的谷歌地图元素，边界半径。在桌面上看起来很稳固，但在移动设备上，地图的边角不是圆角，但地图后面有一个圆形边框。

我已经在网上到处搜索，无法找到有效的解决方案 - 这是谷歌地图的限制，还是我错过了CSS智慧？

<div id="search_params">
     <h3 id="search_by_address_text">search by address</h3>
     <input id="pac-input" class="controls" type="text" placeholder="">
     <div id="map"></div> 
</div>

<script src="https://maps.googleapis.com/maps/api/js?key=myKey&libraries=places&callback=initMap"
async defer></script>

  #map {
    height: 400px;
    width: 600px;
    border: #798589 4px solid;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -o-border-radius: 20px;
    max-width: 99%;
    max-height: 100%;
    margin: auto;
    overflow: hidden;
  }

桌面视图：

移动视图：

Answer 1

您正在为容器添加边框，而不是地图本身，因此它为什么会在移动设备上越过边框（地图的高度增加）

尝试将边框添加到iframe。

Answer 2

Public Sub ShowFalseAF() Dim ws As Worksheet, lr As Long, fCol As Range, clrCols As Range Set ws = ThisWorkbook.Worksheets("Test") lr = ws.Cells(ws.Rows.Count, 21).End(xlUp).Row If lr > 8 Then Set fCol = ws.Range(ws.Cells(9, 21), ws.Cells(lr, 21)) Set clrCols = ws.Range(ws.Cells(9, 8), ws.Cells(lr, 10)) Application.ScreenUpdating = False fCol.AutoFilter 1, False If fCol.SpecialCells(xlCellTypeVisible).Count > 1 Then ws.Rows(9).Hidden = ws.Cells(9, 21) <> False clrCols.Font.Color = vbRed ws.Rows(9).Hidden = False End If fCol.AutoFilter Application.ScreenUpdating = True End If End Sub 的任何样式也没有被遵守，所以我通过设置地图的子div来解决这个问题：

iframe