Help with Flash object in IE: white space

[Craig R]

Trying to add a flash object to my page, you can see it on the column on the right where it displays perfectly in Firefox:

LINK REMOVED

Unforunately if you open this in Internet Explorer 7, there are white pixels added at the bottom of the flash object. It also doesn't seem to want the 20 pixel margin underneath the div.

Can someone tell me where I'm going wrong please?

The flash object is displayed inside 2 divs which are there to create the outer border effect.


html code:
<div class="flash-box2">
<div class="flash-box">
<object width="165" height="250">
<param name="movie" value="../flash/sports-merchandise2009.swf">
<PARAM NAME="wmode" VALUE="transparent">
<embed src="../flash/sports-merchandise2009.swf" width="165" height="250" wmode="transparent">
</embed>
</object>
</div>
</div>

Style sheet:
.flash-box2 {
margin:0 0px 20px 0;
border:1px solid #b0a996;
padding: 5px;
background:#fff;
float: left;
}


.flash-box {
margin:0 0px 0px 0;
border:1px solid #b0a996;
background:#fff;
}

object {
display: block;
margin: 0;
padding: 0;}


This has also made a right mess of my page validation. Any ideas how to add a flash object in a way that is xhtml valid and that still uses the transparency thing so it doesn't overlap my drop-menu?

 

[Craig R]

Ignore this thread, changing the html to this fixed the problem:

<div class="flash-box2">
<div class="flash-box">
<object type="application/x-shockwave-flash" width="165" height="250" data="../flash/sports-merchandise2009.swf">
<param name="movie" value="../flash/sports-merchandise2009.swf"></param>
<param name="wmode" value="transparent"></param>
</object>
</div>
</div>