css - 如何让这张图片落在菜单栏下方？

Question

我正在使用 Angular Material 来创建导航栏。使用 angular-google chart 创建图表。

导航栏和图表是这样的；

部分谷歌图表被导航栏隐藏。

这里是相关的html代码。

<md-toolbar layout="row" class="md-whiteframe-z3" style="padding:0px;margin:0px;position:fixed;">
    <h2>Sample navbar</h2>
</md-toolbar>

<div ng-controller="GoogleChartCtrl">
    <div google-chart chart="presence_detector_Chart" style="height:300px; width:100%;float: left;"></div>
</div>

我想让图表位于导航栏下方，这样它的任何部分都不会被导航栏隐藏。

html代码有什么问题？

Answer 1

只需将以下行添加到您的 GoogleChartCtrl div 中，如下所示:

<div ng-controller="GoogleChartCtrl" style="padding-top: 80px;">

这会在 GoogleChartCtrl div 的顶部增加一些空间。或者，您可以将 padding 更改为 margin。