FireFox Flex Layout/Rendering Issue

Question

The Flex Application is set to 900 pixels width.
The object tag is set to 900 pixels width.

Firefox is rendering the object at 110% the size requested. So there is a blank vertical column on the right size of the object. (It does this if I set fixed height also)

If I set the width in the object tag to 810, then they match up, but thats too much of a hack for me to use.

Here is the object tag.

       <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"  width="100%" height="100%" id="FlashID" title="userlist">
         <param name="movie" value="swf/userlist.swf" />
         <param name="quality" value="high" />
         <param name="wmode" value="opaque" />
         <param name="swfversion" value="9.0.45.0" />
         <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
         <param name="expressinstall" value="Scripts/expressInstall.swf" />
         <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
         <!--[if !IE]>-->
         <object type="application/x-shockwave-flash" data="swf/userlist.swf" width="100%" height="100%" >
           <!--<![endif]-->
           <param name="quality" value="high" />
           <param name="wmode" value="opaque" />
           <param name="swfversion" value="9.0.45.0" />
           <param name="expressinstall" value="Scripts/expressInstall.swf" />
           <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
           <div>
             <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
             <p><a href="http://www.adobe.com/go/getflashplayer"&gt;&lt;img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p>
           </div>
           <!--[if !IE]>-->
         </object>
         <!--<![endif]-->
       </object>

Answer 1

I think this happens because of the outer <object> tag which doesn't do anything useful in FF anyway. You can easily verify this theory by omitting it for testing. If I'm correct, I suggest you use SWFObject to render the embedding code. Alternatively, you could add some CSS trickery to hide that border in FF.

Answer 2

The comments in the code say why that outer object tag is needed. It is there for Internet Explorer.