1

None of the CSS3 properties like border-radius and box-shadow are working inside an <iframe> in IE, though they work perfectly fine in other browsers, and even in IE when not placed in an <iframe>.

Has anyone found any problems like this and ever fixed them?

Please help!

<style type='text/css'>

.seath {
    background-color: #7eaf47;
margin:16px 0px 16px 0px;
padding:16px 16px 16px 16px;
    position: relative;
width:320px;
border-radius:5px;
-moz-border-radius:5px 5px 5px 5px;

    -moz-box-shadow: 0 1px 3px #444444; /*firefox 3.6 and earlier*/
-webkit-box-shadow: 0 1px 3px #444444; /*safari*/
 box-shadow: 0 1px 3px #444444;

}
</style>

<div class='seath'>
...
</div>
Paul D. Waite
  • 96,640
  • 56
  • 199
  • 270
Dipesh KC
  • 3,195
  • 3
  • 32
  • 50
  • 1
    If you are using the iframe to display another webpage, how does the page look when you view the page separately? – anothershrubery Apr 28 '11 at 10:30
  • 1
    Are both your parent document and the iframe document in [standards mode](http://stackoverflow.com/questions/3717932/will-an-iframe-render-in-quirks-mode)? – robertc Apr 28 '11 at 23:17
  • @anothershrubery: I'm using the iframe in the sidebar for log-in/signUp purpose only – Dipesh KC May 06 '11 at 11:26
  • @Dipesh: do you see the same behaviour in the final version of IE 9? If the issue only occurs in the beta, I don’t think it’s worth changing your code (as “beta” means “not finished”). – Paul D. Waite May 10 '11 at 07:48
  • @Paul D.Waite: I haven't tested that on the final version yet, thank you – Dipesh KC May 10 '11 at 08:21

1 Answers1

2

Try this:

Start your iframe html document this way:

<!DOCTYPE html>
<html>
<head>
(...)

This should force the browser to render in standards mode.

Pedro L.
  • 7,376
  • 3
  • 25
  • 27