Question

I want to place 3 divs side by side using CSS. I have gone through many posts on SO, but not getting the thing working for my project.

#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%;
}

The above does not place the div’s in the correct place. I cannot seem to figure out the mistake I am making.

Answer 1

You could float: left all the inner divs:

http://jsfiddle.net/W8dyy/

You should fix the spelling of quotescointainer to 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;
}