Mysterious padding on Flash object?

Forum Moderators: not2easy

Message Too Old, No Replies

Mysterious padding on Flash object?

css flash object padding

eternal

12:47 pm on Sep 29, 2004 (gmt 0)

OK I have embedded a flash movie and I want no padding at the bottom of the flash object so it butts up with my horizontal menu. I have used the following html:

<td class="flash"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="340" height="140"> 
 <param name="movie" value="images/movie.swf"> 
 <param name="quality" value="high"> 
 <embed src="images/movie.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="340" height="140"></embed> 
</object></td>

Here is the css I use for the cell:

.flash{ 
  vertical-align: bottom; 
  text-align:right; 
  padding-right:25px; 
  background-color:#EBF0F5; 
  padding-bottom:0px; 
  margin:0px; 
}

But in Netscape and Mozilla browsers there is a 2pixel gap at the bottom of the object? IE and Opera are ok, does any-one know anything about this?

thanks for your time.

RJell

7:20 pm on Sep 29, 2004 (gmt 0)

I have two suggestions...
1.) Are you using the strict Doctype at the top of your page? I find that adding it takes care of some oddities.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

2.) If the horizontal menu is in a table cell below the one containing the flash, maybe you need to make sure that the border, cellpadding, cellspacing, etc. for the parent table are all zero.


#tablename{
padding: 0;
border: 0;
border-collapse: collapse;
}

eternal

9:04 pm on Sep 29, 2004 (gmt 0)

I am using doctype:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Table below is set to all of those except I need the border on the table so I dont think it is that.

DrDoc

9:24 pm on Sep 29, 2004 (gmt 0)

td object, td embed {
vertical-align: bottom;
}

That should solve it. The 2px space is there to leave room for the descenders on some letters (like g,p,q,j,y etc). Since you have no text in the cell, you want the object to be aligned with the bottom.

Giving the object/embed tag

display: block

would work too.

eternal

9:47 pm on Sep 29, 2004 (gmt 0)

yup that worked. Thanks alot mate!