[css] divy obok siebie = brak obramowania Opcje

[wujek_bogdan]

chcę aby divy zanjdujące się wewnątrz diva "containter" byłu obramowane ramką o szerokości 1px;
wszystko jest ok dopóki nie dodam float:left; (divy mają być obok siebie a nie jeden pod drugim).
gdy dodaje float:left; ramka zamiast obejmować divy obejmuje tylko jeden górny piksel :/

css wygląda tak:

Kod

#container {
margin-top: 10px;
margin: 0px auto;
width: 965px;
height: auto;
padding:0px;
border-style: solid;
border-color: #000;
border-width: 1px;
}

#left {
float:left;
text-align: left;
width: 200px;
border-style: solid;
border-top-width: 0px;
border-left-width: 1px;
border-right-width: 0px;
border-bottom-width: 0px;
   }

#center {
float:right;
text-align: left;
   }

#right {
float:right;
width: 200px;
   }

a html tak:

Kod

<div id="container">

     <div id="left"><p>jakaśtreść1</p>
     </div>

     <div id="center"><p>jakaśtreść2</p>
     </div>

     <div id="right"><p>jakaśtreść3</p>
     </div>
</div>