CSS float "hug center"？

Question

我有两个不同的 div，一个向左浮动，一个向右浮动。它们比整个页面小得多(每个大约 400x200)，因此两者相距甚远，紧贴着页面的边缘。我怎样才能让他们在中心彼此相邻？我尝试分别将边距设置为自动和大约 20px，但它没有改变任何东西..

Answer 1

这是inline-block的工作!

http://jsfiddle.net/hyw6P/

<div id="container">
    <div id="left">Left!</div>
    <div id="right">Right!</div>
</div>​

#container{
text-align:center;
width:100%;
height:300px;
border:1px solid black
}
#left{
border:3px solid blue;
height:100px;
width:100px;
margin:auto;
display:inline-block;
}
#right{
border:3px solid red;
height:100px;
width:100px;
margin:auto;
display:inline-block;
}​