当我使用css将div与页面的中心对齐时，它从图像的左侧而不是中心

Question

这是HTML

<div id="logo">
   <img src="image.png" 
</div>

这是它的CSS

#logo {
    position: absolute;
    display:block;
    /*background:#00FFCC;*/
    top: 5px;
    left:50%;
    max-width: 520px;
    max-height: 150px;
    min-height: 150px;
    min-width: 520px;
}

图像在div的中心对齐但是当我把50％作为左边属性时它使用div的左边作为居中点，所以div的左边是中心而不是中间，我该怎么改变呢？

Answer 1

你可以简单地使用它（或左边距）：

margin:0 auto;

Answer 2

要将img置于徽标中心，请执行此操作

<强> FIDDLE

img
{
    position: absolute;
    left:0;right:0;
    margin:auto;
}

或

<强> FIDDLE

img
{
  display:block;
  margin: 0 auto;
}