Question

我有一行从其父级继承的宽度为1172px。我在行内声明了一个div，我想将它对齐。我尝试应用margin: 0 auto和text-align:center这些无法正常工作。我该如何居中？

<div class="row">
    <div id="YelloBox" class="YelloBox"> 
    </div>                    
</div>

的CSS：

.YelloBox {
    width: 515px;
    height: 602px;
    opacity: 0.3;
    background-color: #ffffff;
    background-color: var(--white);
    border: solid 1px #a28c77;
    border: solid 1px var(--reddish-grey);
    text-align: center;
    margin: 0 auto;
}

Answer 1

只需在css中添加MediaCrypto

即可

display:table

Answer 2

只需使用center-block类。

<div class="row">
    <div id="YelloBox" class="YelloBox center-block"></div>
</div>

请参阅here中的详细信息。

Answer 3

http://www.w3schools.com/css/css_align.asp

我认为这是完全理解对齐所需的全部内容。好好看看并演示它们的演示，因为它们具有相当好的互动性。

http://www.w3schools.com/cssref/css3_pr_flex.asp

Flex也可以做同样的事情，但是阅读属性的支持页面，因为它可能在某些浏览器上失败。

http://caniuse.com/#search=flex

如何将div放在一排中心

3 个答案: