Question

我在这里完全失败了。我已经尝试了一切。不同的显示，位置，浮动...似乎没有任何作用：

标记：

<div id="today-leads" class="total-wrap">
    <h2>Leads</h2>

<div id="leads-wrap">
    <div id="leads-total" class="total">224</div>
    <div id="leads-ticker-wrap">    <i class="icon-caret-up"></i>

        <div id="leads-percentage-change" class="higher">56%</div>
    </div>
</div>

CSS：

    h2 {
    text-align:center;
}
#leads-wrap{
    display:inline-block;
    margin: 0 auto;
}
#leads-ticker-wrap{
    float:left;
}
#leads-total{
    float:left;
}

这是jsfiddle

Answer 1

哪个div？

leads-wrap不会居中，因为它是inline-block而不是block，所以它受其包含块的text-align属性的影响。

leads-ticker-wrap和leads-total不会居中，因为（a）它们向左浮动，（b）您没有设置自动边距。

Answer 2

自动左/右边距仅在相关元素具有已知宽度时才有效。所以添加像

这样的东西

#leads-wrap
{
    width: 65%;
}

显然，您可以根据需要调整实际宽度。

为什么div中心没有汽车保证金？

2 个答案: