并排放置3个div

我想使用CSS并排放置3个div。我已经经历了很多帖子，但没有为我的项目工作。并排放置3个div

#quotescointainer{ 
    width: 100%; 
    font-size: 12px; 
} 
#quotesleft{ 
    float:left; 
    width: 33%; 
    background-color: white; 
} 
#quotescenter{ 
    background-color:white; 
    width: 33%; 
} 
#quotesright{ 
    float:left; 
    width: 33%; 
}

以上不会将div放在正确的位置。我似乎无法弄清楚我正在犯的错误。

来源

2011-06-01 Hozefa

你可以float: left所有内div S：

http://jsfiddle.net/W8dyy/

你应该修正拼写quotescointainer至quotescontainer。

#quotescointainer{ 
    width: 100%; 
    font-size: 12px; 
    overflow: hidden; /* contain floated elements */ 
    background: #ccc 
} 
#quotesleft { 
    float: left; 
    width: 33%; 
    background-color: #bbb; 
} 
#quotescenter { 
    float: left; 
    background-color: #eee; 
    width: 33%; 
} 
#quotesright{ 
    float: left; 
    width: 33%; 
    background-color: #bbb; 
}

来源

2011-06-01 22:04:03 thirtydot

+1不错，但请不要复制'宽度：33％'三次和'背景颜色：＃bbb'。 – Midas 2011-06-01 22:10:45

@Midas：这是一个公平点，但我试图保持OP的简单。我可能会这样做：http://jsfiddle.net/W8dyy/1/ – thirtydot 2011-06-01 22:14:14

@Midas：我不会使用宽度3次。目前刚刚处于测试阶段的发展阶段。所以得到一些原型。 – Hozefa 2011-06-01 22:29:43