【CSS】floatを使い、2つの箱(divとか)を横並べにする方法

こんにちは。

今回は少しCSSを。
どうもfloatで回り込んで画像を入れたり、
HPみたく、main_contentsやsub_menuを作るさい
見栄え上きれいにいかないことがあるので、メモ。

overflow: hidden;

どうやらこの overflow : hidden　を
floatさせたい1つうえの属性に付与してあげると、型崩れが抑えられる模様。

ちなみに僕は

<div class="contents">
  <div class="sub_menu">
  </div>
  <div class="main_menu">
  </div>
</div>

.contents{
  width:950px;
  overflow: hidden; 
}

.sub_menu{
  float : left ;
  width: 300px ;
}

.main_menu{
  float : left ;
  width : 600px ;
}

で横並べにして、全体のサイズ指定とmargin,paddingで幅を調整していくんですが
これは綺麗なやりかたなのでしょうか。

なんか float:left を2回って上手くない気がします。

それでは、これからもよろしくお願いいたします。