Object tag unwanted space above and bellow

Question

Here is my HTML:

<p>
    Ut molestie venenatis enim mattis cursus. Duis lacinia mauris nec nulla rutrum condimentum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin et felis mi. Ut posuere, eros in vulputate auctor, ante dui egestas metus, in pulvinar dolor mauris eget enim. Fusce in nunc sit amet elit facilisis congue. Nunc malesuada, nibh pretium viverra rutrum, diam nibh congue lacus, a pretium lorem turpis vitae felis. Curabitur nec lectus in velit dictum fringilla et non risus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam tincidunt ornare libero quis cursus. Cras varius pharetra pellentesque. Sed fermentum felis vitae enim vulputate placerat.</p>
<p>
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"&gt;&lt;param name="quality" value="/clientarea/utils/locate-flash?path=high">
<param name="movie" value="/clientarea/utils/locate-flash?path=data%2Fmedia%2Fflash%2F4.swf">
<embed pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" src="/clientarea/utils/locate-flash?path=data%2Fmedia%2Fflash%2F4.swf" type="application/x-shockwave-flash"></embed></object></p>
<p>

    In sapien libero, aliquet eget ornare sed, suscipit ut turpis. Donec eget magna massa, vitae ullamcorper metus. Nullam ac lectus eu magna convallis auctor. Nam in massa urna, vel placerat felis. Nulla fermentum felis ut libero sagittis et pretium mi pretium. Cras quis urna id massa fringilla porta sed fringilla magna. Duis in neque ac lectus rhoncus sagittis. Integer augue est, congue non interdum condimentum, egestas a tellus. Nulla consectetur, justo ac fermentum gravida, dolor nunc posuere odio, placerat lobortis lacus orci et justo. Praesent commodo mattis ligula in pulvinar. Nunc interdum vulputate dolor, at malesuada sapien luctus at. Sed suscipit turpis in tellus interdum vehicula. Sed quis velit enim. Maecenas placerat ullamcorper sollicitudin.</p>

Basically, I am inserting a flash animation into text with object, param, embed tags.

However there is an unwated gap above and bellow the flash animation (about 40px I guess).

I have resetted both margin and padding for object, param and embed tags. The gap is still there. How can I solve this?

NOTE: I know I could use width and height attributes with object tag but the users who will be inserting flash animations into HTML won't know their dimensions so they won't be able to insert these parameters.

Answer 1

Try replacing the containing paragraph with a <div> instead, as paragraphs have padding and margins by default.

If this doesn't work, then it may be worth putting background-colors (as strong, violent and hideous as possible - to help you remember to change them back!) and try and work out where the padding or margin is coming from. You might stand more chance then of being able to determine where you need to be removing from.

Answer 2

Try setting object to display:block. 'Object' is display-inline by default which means it can inherit line-height. Also, I second the suggestion to remove it from the <p> tags first!