如何将流体div放在同一条线上？

Question

我在Dreamweaver中使用了流畅的网格布局，并且我在同一行上有三个div。它看起来很不错，除了我想将所有三个div放在页面上。现在他们都被转移到左边，因为这显然是他们被告知要做的事情。我只是不知道如何告诉他们集中注意力。

非常感谢帮助！

此刻看起来完全像这样（不是我的形象）：

#item1 {
    clear: both;
    float: left;
    margin-left: 0;
    width: 32.6007%;
    display: block;
}
#item2 {
    clear: none;
    float: left;
    margin-left: 1.0989%;
    width: 32.6007%;
    display: block;
}
#item3 {
    clear: none;
    float: left;
    margin-left: 1.0989%;
    width: 32.6007%;
    display: block;

#featuredholder {
clear: both;
float: left;
margin-left: 0;
width: 100%;
display: block;
}

编辑：

请看一下这张照片，看看我到底在做什么。

我需要这些div居中并且仍然流畅。

Answer 1

嘿现在习惯这个css就像这样

#wrapper{
margin:0 auto;
width:800px;
overflow:hidden;
}

#item1, #item2 , #item3 {
float:left;
width:30%;
 }
#item1{
margin-left:3%;
}

Answer 2

如果我理解正确，您只需要将margin: 0 auto;添加到您的包装器中。

#wrapper
{
    width: 80%;
    margin: 0 auto;
    padding: 10px;
}

#item1 {
    float: left;
    width: 32.6007%;
}
#item2 {
    float: left;
    width: 32.6007%;
}
#item3 {
    float: left;
    width: 32.6007%;
}

span.clear /*clearfix*/
{
    display: block;
    clear: both;
}

此外，您不需要在div上声明display: block;，因为默认情况下它是块级元素。同时删除div上的清除，否则会破坏浮动（这是你的三个div之后的span.clear。）

演示：http://jsfiddle.net/Kyle_Sevenoaks/ZSYnW/

---

在你的评论之后，你需要添加一个额外的div来包围居中的元素，将div的边距设置为0 auto并重构HTML的其余部分，以便每个两个块位于另一个包装div中：）

http://jsfiddle.net/Kyle_Sevenoaks/ZSYnW/1/