Angular-Material 工具栏上方 1 英寸空白 space

Question

我注意到当我在 Chrome 上使用 Angular Material 工具栏时，我在 window（页面，模态，对话框等...）。我该如何删除它？

生成模态的代码：

<md-dialog aria-label="Game Info and Map">
    <md-dialog-content>
        <md-toolbar flex layout="row" layout-align="space-between center">
            <img ng-src="{{schedule.HomeTeamLogo}}" class="TeamLogo" alt="{{schedule.HomeTeamName}} Logo" />
            <h5>{{schedule.GameDate | SLS_Date}} @ {{schedule.GameTime | SLS_Time:'hh:mm'}}</h5>
            <img ng-src="{{schedule.AwayTeamLogo}}" class="TeamLogo" alt="{{schedule.AwayTeamName}} Logo" />
        </md-toolbar>
        <section layout="column" layout-align="center">
            <div ng-init="coords={latitude: false, longitude: false}">
                <gm-map options="{center: [{{schedule.Latitude}}, {{schedule.Longtitude}}], zoom: 13, mapTypeId: google.maps.MapTypeId.ROADMAP}">
                    <gm-marker options="{position: [{{schedule.Latitude}}, {{schedule.Longtitude}}], draggable: false}">
                        <gm-infowindow options="{content: '{{schedule.VenueName}}'}"></gm-infowindow>
                    </gm-marker>
                </gm-map>
            </div>
        </section>
    </md-dialog-content>    

    <section>
        <div class="md-actions">
            <md-button ng-click="CloseDialog()" class="md-fab md-fab-bottom-right md-mini" aria-label="Close"><ng-md-icon icon="close"></ng-md-icon></md-button>
        </div>
    </section>
</md-dialog>

Plunkr

Answer 1

史蒂文，

在我看来，您的 md-action css class 有一个 min-height: 52px。有点奇怪，但您可以在 css 中解决这个问题。在这个 plunker 上尝试类似的东西。如果此 css 更改的影响超出应有的范围，请尝试专门化您的 css，例如添加一个新的 class 左右。

希望对您有所帮助:)

Angular-Material 工具栏上方 1 英寸空白 space

Angular-Material 1 inch blank space above toolbar

angular-material