当我应用'margin: auto‘时页脚不居中

Question

我试过了，但页脚不居中。我试着把display: block或inline-block放在一起，但这对我也不起作用。

HTML：

<div id="secondfooter">
   <p>COPYRIGHT 2020 HYUNDAI AUTO ROMANIA. TOATE DREPTURILE REZERVATE.</p>
</div>

CSS：

#secondfooter {

    width: 900px;
    margin: auto;
    font-size: 13px;
    background: #c00000;
    font-family: arial;
    text-align: center;
    color: white;
    float: left;
}

下面是jsfiddle链接：

https://jsfiddle.net/bogdan9/o14p39ek/

Answer 1

尝试删除向左浮动，它应该会起作用：

#secondfooter {
    width: 900px;
    margin: auto;
    font-size: 13px;
    background: #c00000;
    font-family: arial;
    text-align: center;
    color: white;
}

我把它移走了，在我看来它起作用了。

Answer 2

使用flexbox和宽度: 100%。不管你在哪个屏幕上，它都会在中间。

​

#secondfooter {
    margin: auto;
    font-size: 13px;
    background: #c00000;
    font-family: arial;
    color: white;
  
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

}

<div id="secondfooter">
            <p>COPYRIGHT 2020 HYUNDAI AUTO ROMANIA. TOATE DREPTURILE REZERVATE.</p>

    </div>

​

Answer 3

将width: 100%交给#secondfooter

#secondfooter {
  width: 100%;
  margin: auto;
  font-size: 13px;
  background: #c00000;
  font-family: arial;
  text-align: center;
  color: white;
}