Question

我正在使用自适应博客主题，并且很难将我的网站徽标集中在一起。这就是我在style.css中的site-logo看起来的样子（根据inspect元素）：

#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

如果你知道徽标的宽度，只需使用margin：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自动将元素置于中心

在响应式博客主题中居中对齐网站徽标

2 个答案: