中心 「左浮動」 的內容（文本對齊：中心;不會工作）

Question

#content 
{ 
    background-color: red; 
    text-align: center; 
} 

#content div 
{ 
    float: left; 
    background-color: green; 
    padding: 10px; 
    margin: 10px; 
} 

<div id="content"> 
    <div>AAAAA</div> 
    <div>AAAAA</div> 
    <div>AAAAA</div> 
    <div>AAAAA</div> 
    <div>AAAAA</div> 
    <div>AAAAA</div> 
    <div>AAAAA</div> 
    <div>AAAAA</div> 
</div> 
<div style="clear: both;"></div> 

http://jsfiddle.net/nTLny/

這裏通常的代碼。我要實現以下目標：

所以對準DIV去中心。

Answer 1

文本對齊中心將工作，如果你使用display:inline-block而不是使用float

JSfiddle

的CS

#content div 
{ 
display: inline-block; 
background-color: green; 
padding: 10px;   
margin: 10px; 
} 

Answer 2

#content div 
{ 
    float: none; 
    display:inline-block; 
    background-color: green; 
    padding: 10px; 
    margin: 10px; 
} 

Answer 3

嘗試...

#content div { 
    background-color: #008000; 
    display: inline-block; 
    margin: 10px; 
    padding: 10px; 
} 

Answer 4

你的CSS：

#content{ 
background-color:white ; 
text-align: center; 
width:300px; /*giving it a width so it actually adjust to your sample image 300px seems to be close to yours*/ 
} 

#content div 
{ 
display: inline-block; /*second adjustment you need as "Abhineet" has mentioned*/ 
background-color: green; 
padding: 10px; 
margin: 10px; 
} 
#bottom { 

float:right; 
}