Question

我试图以粘性页脚为中心无济于事。这就是我试过的：

HTML：

    <div class="footer-be">
        <div class="footer-be-middle">
            <eGov:EgovReusableContentControl runat="server" id="menuContent" ReusableContentListItemTitle="MasterPage_FooterMenus"/>
        </div>                              
    </div>

CSS：

    .footer-be {
        position: fixed;
        bottom: 0;
        width: 100%;
        z-index: 9999;
        background-color: white !important;
        font-family: "Calibri";
    }

    .footer-be-middle
    {   
        text-align: center;
        height: 100%;
        overflow: hidden;
        width: 60%;
        margin: 0 auto;


    }

我正在使用带有自定义（内部）主题的SharePoint 2013。我不得不修改页脚部分（删除它），因为每当用户滚动时我都需要将页脚粘到底部。

我做错了什么？

Answer 1

首先，如果页脚宽度为100％，为什么页脚会有边距？所以我摆脱了边缘，所以现在你在页面的最底部有一个100％宽的元素其次，您需要为居中的div提供自动水平边距。 HTML：

 <div class="footer-be">
   <div class="footer-be-middle">
     <eGov:EgovReusableContentControl runat="server" id="menuContent" ReusableContentListItemTitle="MasterPage_FooterMenus"/>
   </div>                              
</div>

的CSS：

.footer-be {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 9999;
    height: 80px;
    background-color: red !important;
    font-family: "Calibri";
}

.footer-be-middle
{   
  width: 50%;
  margin: 0 auto;

  text-align: center;
  height: 100%;
  overflow: hidden;
  background-color: green;
}

小提琴： https://jsfiddle.net/2zr7gr7z/

HTM / CSS - 粘性页脚不居中

1 个答案: