Question

我有问题。这是我的代码：

<body>
    <div class="imerologio">
        <div id="imerologio-mistika">    
            <a href="foo"><img src="#"></a>
        </div>

        <div id="imerologio-xarti">    
            <a href="foo"><img src="#"></a>
        </div>
    </div>

我的css是：

.imerologio{
    display: inline-block;
    width: 100%;
}

#imerologio-mistika{
    background: url("../images/imerologio/mistika.png") no-repeat;
    float:left;
}

#imerologio-xarti{
    background: url("../images/imerologio/xarti.png") no-repeat;
    float:left;
}

我的魔杖以内部div为中心，但我不能。有什么帮助吗？

Answer 1

您必须移除浮动，将display: inline-block设置为项目，将text-align: center设置为容器。

＆＃13;

.imerologio {
  text-align: center;
  width: 100%;
}
#imerologio-mistika {
  background: url("../images/imerologio/mistika.png") no-repeat;
  display: inline-block;
  width: 50%;
}
#imerologio-xarti {
  background: url("../images/imerologio/xarti.png") no-repeat;
  display: inline-block;
  width: 50%;
}

＆＃13;

<div class="imerologio">
  <div id="imerologio-mistika">
    <a href="foo">
      <img src="#">
    </a>
  </div><!--

  --><div id="imerologio-xarti">
    <a href="foo">
      <img src="#">
    </a>
  </div>
</div>

＆＃13;

把div放在中心位置

1 个答案: