html - 私のcssルールにもかかわらず、div自体のサイズを変更する

Question

次のようなHTMLが少しあります。

<div class="pointwrap">
  <div class="imgwrap">
   <img src="howtoplay1.jpg" height="101" width="177"/>
  </div>
  <div class="textwrap">
    Tap Anywhere in the Drop zone to release a ball.
  </div>
</div>

このコードの CSS ルールは次のようになります。

.pointwrap
{
border-style:solid;
border-width:2px;
border-color:#2E2E2E;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-color:#848484;
margin:3px 7px 7px 7px;
width:290px;
height:170px;
}

.imgwrap
{
width:120;
margin:5px 5px 5px 5px;
float:left;
}

.textwrap
{

FONT-SIZE:9px;
margin:0px 6px 6px 6px;
float:right;
}

div.textwrap
{
width:40;
height:110;
float:right;
}

私の問題は、ページをロードするたびに、textwrap div のサイズが変更されたり、完全に間違ったものに再調整されたりすることです。

幅 40 ピクセル、高さ 110 ピクセルの右側にフロートするように設定しましたが、現在は img div の右側ではなく下に配置され、imgwrap div のサイズが幅 217 ピクセル、高さ 11 ピクセルに変更されています (ちょうどテキストをカバーしています...）。

このテキストを img の右側に保持し、CSS ルールで設定した高さ/幅のパラメータ内に収めるにはどうすればよいですか?