如何在没有宽度和边距的情况下水平居中div

Question

如何在不支持旧版本浏览器的情况下水平居中div而不是宽度display：inline-block属性。

如何中心我.container股利水平不宽

<div class="main_section"> 
    <div class="content_wrapper"> 
    <div class="container">My content</div> 
    </div> 
</div> 

Answer 1

让你想中心（.container）inline-block的内容。这样你可以在父div上使用text-align: center作为中心。

.container { 
 
    display: inline-block; 
 
    background-color: red; 
 
} 
 

 
.content_wrapper { 
 
    background-color: blue; 
 
    text-align: center; 
 
}

<div class="main_section"> 
 
    <div class="content_wrapper"> 
 
    <div class="container">My content</div> 
 
    </div> 
 
</div>

Answer 2

body { 
 
    padding: 200px 0 0 0; 
 
    margin: 0; 
 
} 
 
.main_section { 
 
    float: right; 
 
    position: relative; 
 
    right: 50%; 
 
    z-index: 999; 
 
} 
 
.content_wrapper { 
 
    float: right; 
 
    position: relative; 
 
    right: -50%; 
 
} 
 
.container { 
 
    color: #333; 
 
    background: #f5f5f5; 
 
    border: 5px #ccc solid; 
 
    padding: 10px; 
 
    font-family: Arial, Helvetica, sans-serif; 
 
    font-size: 20px; 
 
    letter-spacing: 1px; 
 
    max-width: 1000px; 
 
    box-shadow: -1px -1px 5px 1px #666666; 
 
}

<div class="main_section"> 
 
    <div class="content_wrapper"> 
 
    <div class="container">Div align center without fix width</div> 
 
    </div> 
 
</div>

Answer 3

你可以尝试设置外层div保证金：0汽车

它将为响应工作了。