title: Strange behaviour when dynamically resizing Flash / Flex embed object
body: <p>I have a simple Flex application that is a panel with a repeater inside of it; albeit a little simplified, it is like such:</p>
  
  <pre>
  <code>
  &lt;mx:Panel id="pnl">
      &lt;mx:Repeater id="rp">
          &lt;mx:Label text = "foo" />
      &lt/mx:Repeater>
  &lt/mx:Panel>
  </code>
  </pre>
  
  <p>I am then embedding this Flex application into an HTML wrapper. I am then attempting to dynamically re size the embedded Flash object in the HTML as the Flex panel changes size (thus allowing the Flex application to consume as much of the HTML page as it needs). </p>
  
  <p>I am doing this by doing the following actionscipt:</p>
  
  <p><pre>
  <code>
  pnl.addEventListener(ResizeEvent.RESIZE,function(event:Event):void {
      ExternalInterface.call("resize",event.target.height);
  });
  </code>
  </pre>which in turn calls this javascript function:</p>
  
  <pre>
  <code>
  function resize(height) {
      // the embed or object that contains the flex app
      var e = document.getElementById('flex_object');
      if(e) e.height = height;
  }
  </code>
  </pre>
  
  <p>This seems to work perfect in IE, however I get strange results in Firefox / Safari, the repeater works for <em>n</em> number of times, and then the text seems to get cut off / disappear in the repeater, see the attached image:
  <a href="http://img528.imageshack.us/img528/9538/rpre0.jpg" rel="nofollow noreferrer">alt text http://img528.imageshack.us/img528/9538/rpre0.jpg</a></p>
  
  <p>Can anyone explain why this is happening, and if there are any workarounds / ways of doing the same thing?</p>