如何將一個div放在一行中心

我有一行寬度爲1172px的行繼承其父級。我已經在行內聲明瞭一個div，並且我想將它對齊。我嘗試申請margin: 0 auto和text-align:center哪些不起作用。我如何居中？如何將一個div放在一行中心

<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; 
}

來源

2016-08-31 Satyadev

就在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; 
 
    display: table; 
 
}

來源

2016-08-31 08:34:50

可否請您提供一些信息，爲什麼它不適合我，以便我理解這個概念。謝謝 – Satyadev

'text-align：center'用於對齊文本元素..不是div元素。如果你將這個元素賦給div元素意味着將元素內部的文本對齊 –

否我的意思是爲什麼'display：table working'而不是'marin：0 auto' – Satyadev

添加

我認爲這是你需要完全理解對齊的全部內容。仔細觀察並使用演示，因爲它們具有很好的互動性。

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

的Flex也可以做同樣的事情，但閱讀的支持頁面的屬性，因爲它可能會在某些瀏覽器失敗。

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

來源

2016-08-31 08:41:33

只需使用center-block類。

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

查看詳情在here。

來源

2016-08-31 08:47:38

如何將一個div放在一行中心

回答

相關問題