在回复博客主题中居中对齐网站徽标

Question

我正在使用响应式博客主题，并有一个艰难的时间，我的网站标志居中。这是我的网站徽标在style.css中的样子(根据inspect element)：

#header img {
  margin: 0 0.75em 0 1em;
  display: block;
  float: right;
  margin-left: auto;
  margin-right: auto;

  height: auto;
  max-width: 100%;
}
#header #site-logo { 
  margin-left: -82.5%;
  height: 100px;
  padding: 2.5em 0;
}

我尝试更改这两个div的边距、文本对齐和浮动，但都没有效果。我不知道，如果我必须查看style.css上的任何其他ID或类。

Answer 1

如果您知道徽标的宽度，只需使用边距:0 auto；http://jsfiddle.net/NVLtM/

#header #site-logo {
  display:block;
  width:200px;
  margin:0 auto;
}

如果你不知道图片的宽度，可以让图片成为一个内联块元素，并在父元素http://jsfiddle.net/NVLtM/1/上使用text-align:center。

#header {
  text-align:center;
}

#header #site-logo {
  display:inline-block;
}

Answer 2

去掉浮动，去掉现有页边距，不需要宽度；

页边距:0自动将元素居中