I have an issue that is driving me nuts courtesy of IE.

Take a youtube video:

<object width="480" height="385">
<param NAME="movie" VALUE="http://www.youtube.com/v/m_dz1SDw7pA?fs=1&amp;hl=en_GB"></param>
<param NAME="allowFullScreen" VALUE="true"></param>
<param NAME="allowscriptaccess" VALUE="always"></param>
<embed src="http://www.youtube.com/v/m_dz1SDw7pA?fs=1&amp;hl=en_GB" TYPE="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed>
Once this is loaded to a document I want to change the width and height. The exact width and height come from an image used to represent the video in a WYSIWYG rich text editor (TinyMCE).

I can get the image, height, width and float and apply to the object and embed and this works fine in FF.

In IE the width and height are always ignored because I cannot access the embed tag via DOM. I have tried getElementsByTagName('embed') which returns 0 length and also looping the children of the object which shows me the three params but no embed.

This might be expected in IE but what is weird is that when the code is rendered to the browser the height and width of the embed are determining the size of the video. I can't touch the embed via DOM and yet I am stuck with the height and width attributes within it.

I have tested by downsizing the embed height/width in the database and IE rendered the video to those dimensions regardless. I also tried taking the embed out and the video failed to load with a red x.

Any ideas?