problema spaginamento colonna float

[neorf]

Ho una semplice struttura a 2 colonne:
1 container 2 base con immagine di sfondo, la colonna sinistra, che è il testo principale, con float-left. Poi la parte destra, column_right. Il tutto con il css sotto.
Il problema è che se la column_center, che è float-left, supera in altezza column_right, si spagina lo sfondo e lo sfondo non si ripete più. Questo non accade se column_right è maggiore di column_center.

<div id="container">
 <div id="column_center"></div>
 <div id="column_right"></div>
</div>

#container{
width: 940px;
background-color: white;
background: url('bg20.png') repeat-y;
margin: 0 auto;
text-align: center;

}
#column_center {
      float:left;
       background-color:blue;
       width: 700px;
  }
#column_right {
   height:500px;
    margin-left: 705px;
}