CSS Firefox 中的边距中心工作不在 Chrome 中

Question

我想在页面底部制作一个固定位置的横幅，滚动时冻结。

.content {
      position: fixed;
      margin: 0% auto;
      left:0;
      right:0;
      bottom:0px;
      z-index: 999999999;
}

<table class="content">
    <tr>
        <td>
            <img src="logo.png">
        </td>
    </tr>
</table>

我使用了那个设置，什么时候在 firefox 中进行了测试，它工作得很好，但在 Chrome 中却不行，横幅位置仍然在左边，而不是中间。

有人可以帮助我吗？我只想在页面底部制作一个横幅，固定位置（滚动时冻结），边距居中。谢谢

Answer 1

margin: auto 仅在该元素具有固定宽度时才起作用 table。

或

你可以使用下面的代码我使用 div 而不是 table，这比 table 更好。我已使 div 弯曲并将内容居中对齐。

.content {
    position: fixed;
    margin: 0 auto;
    left:0;
    right:0;
    z-index: 999999999;
    bottom:0px;
    display:flex;
    justify-content:center;
}

<div class="content"> 
  <img src="logo.png">
</div>

CSS Firefox 中的边距中心工作不在 Chrome 中

CSS Margin Center Work in Firefox Not in Chrome

html

css

banner