hide square corners on embeded swf using css3 border-radius

Question

On my website, I have a big .swf file. The graphic designer made the .swf look like it was in a rounded corner box but when I embed the file, even using transparent wmode, I see the bottom corners showing. I tried using CSS3 and making the swf div a class inside the border div.

CSS Code:

#swf_border{border:3px solid #a1a1a1;height:400px;width:940px;margin:0px 0px 0px 157px;z-index:100;border-radius:13px;-moz-border-radius:13px;}
#swf_border .home_display{height:400px;margin:0 auto 10px;width:940px;}

HTML Code:

<div id="swf_border">
  <div class="home_display">
    <object width="940" height="400">
      <param name="movie" value="/theme/listgiant/swf/home_banner.swf"></param>
      <param name="quality" value="high" />
      <param name="wmode" value="transparent" />
      <param name="swfversion" value="8.0.35.0" />
      <embed src="/theme/listgiant/swf/home_banner.swf" width="940" height="400" wmode="transparent"></embed>
    </object>
  </div><!-- End home_display-->
</div><!-- End swf_border-->

Could you link a screenshot please? – Kodiak Mar 23 '11 at 17:26 — Kodiak, Mar 23 '11 at 17:26
[Here's a link to the site](http://www.listgiant.com) – smulholland2 Mar 23 '11 at 18:04 — smulholland2, Mar 23 '11 at 18:04

score 3 · Accepted Answer · answered Mar 23 '11 at 18:29

3

To my knowledge, you can not use CSS3 corners to crop a SWF.

As for your site... there is a gray background in the SWF. Ask your designer to remove it and you should be all set.

answered Mar 23 '11 at 18:29

Derek Hunziker

12,996
4
57
105

I got the .fla from the designer. There was no grey background :( – smulholland2 Mar 24 '11 at 17:22
You can do border-radius on Webkit, but on FF you can only mask it https://developer.mozilla.org/en/CSS/mask – Benjamin Intal May 01 '12 at 22:15

jakubferenc · Answer 2 · 2011-08-15T13:13:05.130

1

Actually, you can use CSS3 to crop a SWF. But I've come across a problem with using CSS3 PIE which I use to enable CSS3 effects in IE8. This .htc script cannot crop a SWF properly even though I have not found any notice about the problem in the CSS3 PIE manual.

Edit:

Opera 11 cannot render rounded corners over flash object either.

edited Aug 15 '11 at 13:13

answered Aug 15 '11 at 13:04

jakubferenc

23
1
6

hide square corners on embeded swf using css3 border-radius

2 Answers2