jQuery resizable dialog with the tinyMCE plugin shifts the titlebar

Question

I have a jQuery dialog box that I'm popping up which has a TinyMCE editor plugin surrounding a text area. For some reason, whenever I make the dialog resizable (i.e. resizable: 'true'), the title bar shifts up about 10 pixels (i.e. the top is partially cut off). When the dialog is not resizable, the title bar does not move. I've tried everything I can think of, including wrapping the entire dialog content in a DIV and setting overflow: hidden to keep it from moving the title bar up. Has anyone else experienced this behavior and how can I fix it. If I don't establish the editor (i.e. keep it as a text area, everything works perfectly.

Here is the contents of my dialog box:

<div id="containingDiv" style="display: none; padding-left: 5px; padding-right: 5px; padding-bottom: 25px;  overflow: hidden;">
  <div style="float: left; width: 100%;">
    <div style="width: 30%; height: 100%; float: left;">
      <div class="ui-widget-content ui-corner-all" style="width: 100%; height: 100%;">
        <div class="ui-corner-all" style="width: 100%; height: 100%; overflow: auto;">
          <table id="watchList" border="0" cellspacing="0" cellpadding="2" style="width: 100%;">
            <thead>
              <tr class="ui-widget-header" style="font-size: 62.5%;">
                <th>Date</th><th>User<th>
              </tr>
            </thead>
            <tbody>
            </tbody>
          </table>
        </div>
      </div>

    </div>
    <div style="width: 69%; height: 100%;float: right;">
      <textarea class="tinymce"  style="width: 100%; height: 100%;"></textarea>
    </div>
  </div>
</div>