首页 文章

始终定位底部页脚

提问于
浏览 次
-1

我有页脚，但谷歌 Map 有问题 .

<table class="sortable table table-bordered table-responsive " id="table"  ng-show="bsalInfo">
    <tbody>
        <tr ng-repeat="att in bsalInfo track by $index">
               <td>{{att.name}}</td>
        </tr>
    </tbody>
</table>

启动此脚本我的谷歌 Map

<div class="col-md-12" >
    <div id="map" style="width:100%;  height: 60%; position: absolute;margin-top: 45px;">
        <div id="map"></div>
    </div>
</div>

完成此脚本我的谷歌 Map

这个css页脚

footer{
    position: relative;
    bottom: 0 ;
    margin-left: auto;
    margin-right: auto;
    width: 100%;

}

我的问题在哪里？我的页脚在 Map 上，我希望页脚总是在页面上 . 2当页脚页面上的滚动总是坐下时，无论页面上有多少结果 .

html css

2 回答

  • 0

    我希望您的页脚位于页面底部，但不是 fixed .

    HTML

    <html>
   <head></head>
   <body>        
      <div id="header"></div>
      <div id="content"></div>
      <div id="footer"></div>     
   </body>
</html>

    CSS

    html {
      height: 100%;
    }

body {
  position: relative;
  margin: 0;
  min-height: 100%;  
  padding: 0;
}

#header {
  background: green;
  height: 90px;
}

#footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 90px;
  background-color: red;
}
    回复于
  • 0

    您似乎没有在代码中显示任何元素 <footer> . 但如果您希望页脚持久保留在页面底部，请使用 position: fixed; 和 bottom: 0; 以及其他样式

    了解它here

    回复于

相关问题