float解除直後のborderつき文章の配置方法

質問

floatを使って複雑にボックスを配置し、その一番下にborderで囲った文章を配置したいのですが、
Coment4で設定したborderと文章が、borderはPhot1のすぐ下に表示され、
文章はphot4の下から表示されてしまいます。
phot1と同じ左隅からborderで囲まれた文章を配置するにはどうしたらいいのでしょうか？

<style type="text/css">
#phot1{
width: 750px;
height: 50px;
/*ここからはgoo質問用(実際は入れない)*/
background-color: #48637e;
color: #fff;
}
#left{
float: left;
width: 450px;
margin: 10px;
/*↓goo質問用*/
border: 1px solid #39f;
}
#Coment1{
font-size: 16px;
color: #fff;
line-height: 110%;
/*↓goo質問用*/
width: 400px;
height: 60px;
background-color: #8493bb ;
}
#Coment2{
font-size: 12px;
color: #000;
/*↓goo質問用*/
width: 300px;
height: 60px;
background-color: #777;
}
#phot2{
padding-left: 60px;
background: url("sample.jpg") 0 0 no-repeat;
float: left;
margin: 0;/*バグ？余白を削除*/
/*↓goo質問用*/
background-color: #ff0;
width: 140px;
}
#phot3{
float: left;
overflow: hidden;
/*↓goo質問用*/
border: 1px solid #e37615 ;
width: 200px;
}
#right{
float: left;
width: 270px;
margin-top: 10px;
overflow: hidden;
/*↓goo質問用*/
border: 1px solid #7c4b15;
}
#Coment3{
float: left;
font-size: 12px;
width: 180px;
/*↓goo質問用*/
border: 1px solid #000;
height: 140px;
}
#phot4{
float: left;
overflow: hidden;
margin: 5px;
width: 70px;
/*↓goo質問用*/
border: 1px solid #ff3cb9;
}
#phot4 ul{
display: inline;
text-align: center;
line-height: 18px;
}
#Coment4{
/*ここからはgoo質問用(実際は入れない)*/
border: 10px solid #f00;
width: 750px;
height: 50px;
}
</style>

----------------------

<div id="phot1">画像1</div>
<div id="kono_div_hituyoukana">
<div id="left">
<div id="Coment1">coment1coment1coment1</div>
<div id="Coment2">coment2coment2</div>
<div id="phot2">横50px背景画像</div>
<div id="phot3">画像3</div>
</div>
<div id="right">
<div id="Coment3">coment3coment3coment3coment<wbr />
　3coment3coment3coment3comen<wbr />
　t3coment3coment3</div>
<div id="phot4"><ul><li><img src="sample.jpg" width="65" height="80">画像4</li></ul></div>
</div></div>
<div id="Coment4">Coment4Coment4</div>

回答No.1

noris02 · ベストアンサー

<br style="clear:both;">
<div id="Coment4">Coment4Coment4</div>
とする。

もしくは
#kono_div_hituyoukana{float:left;display:block;}
を 指定する。

が、私は　前者が 好きです。

お礼

ありがとうございました。