2

I have a iframe like this: (this frame appears on left of screen at all time)

<iframe src="frame/index.html" class="left"></iframe>

and the CSS

.left
{
position: fixed;
top: 25%;
left: 1em;  
width:200px;
height:200px;
overflow:hidden;
margin-right:10px;
border-style:none;
}

It works perfect in all web-kit browser, but on IE it appears on top(and middle) with border and abnormal height.

I tried messing up with lot of positioning but couldnot get it right. Any help would be appreciated! Thanks in advance

Cheers!

WhatisSober
  • 988
  • 2
  • 12
  • 32
  • 1
    Which version of IE are you talking about? – Terry Mar 05 '13 at 23:28
  • All of them actually. I tried on IE7, IE8 and IE9! – WhatisSober Mar 05 '13 at 23:34
  • 1
    IE is known to disregard CSS rules and even JS when rendering ` – Terry Mar 05 '13 at 23:45

2 Answers2

2

Seems like this fiddle works on my IE9 (9.0.8112.164). The positioning looks consistent across browsers.

http://jsfiddle.net/5sbXG/2/

I did change the iframe tag from your example to get rid of the scroll bars (IE seems to ignore overflow:hidden on iframes).

<iframe src="http://www.rockpapershotgun.com" class="left" scrolling="no">
</iframe>

Does it look wrong from your end?

Brian Fitzpatrick
  • 347
  • 1
  • 11
1

Adding:

frameBorder="0";
scrolling="no";
position:absolute;
allowtransparency="true";

worked!

WhatisSober
  • 988
  • 2
  • 12
  • 32