Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

CSS - mozilla vs IE - iframe

Status
Not open for further replies.

dartmoortom

Programmer
Apr 19, 2011
5
GB
Hi guys,

I have the code to tell an iframe to sit over a certain section of a page - and dont worry I have allready confirmed with the owners of the other site this is OK with them.

my problem lies in browser compatability in mozilla I get one part of the page but in IE the section has moved slighty. I have worked out the pixels needed for each clipping and tried this code:

Code:
<div style="overflow:hidden; width:795px; height:351px !important; -moz-height:357px; margin:0 auto;">
          <iframe src="[URL unfurl="true"]http://www.helpfulholidays.com/property.asp?ref=A614"[/URL] scrolling="no" style="width:1000px; height:1300px; border:none; margin-left:-180px; margin-top:-689px !important; -moz-margin-top:-729px;"></iframe>
          </div>

any pointers please??
 
Sorry I think you have misunderstood what I'm doing.

The iframe is displaying a specific part of another website on my website....

however in IE you get a different part of that page than in FF.

The item I want to display can be found on:

the section i need in ff=
795px wide x 357px high
the section of this page i want to dispay is
-180px left and -729px top

in IE=
795px x 351px
-180px left -689px top

any ideas?
 
The CSS applied to an iframe affects the iframe NOT the page inside it.

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum
 
I know....

I was thinking though seeing as I can't alter a remote site's css can I resize my iframe to accommodate the area I want so when my page loads in IE:-
Code:
<div style="overflow:hidden; width:795px; height:351px; margin:0 auto;">
          <iframe src="[URL unfurl="true"]http://www.helpfulholidays.com/property.asp?ref=A614"[/URL] scrolling="no" style="width:1000px; height:1300px; border:none; margin-left:-180px; margin-top:-689px;"></iframe>
          </div>
when it loads in FF:-
Code:
<div style="overflow:hidden; width:795px; height:357px; margin:0 auto;">
          <iframe src="[URL unfurl="true"]http://www.helpfulholidays.com/property.asp?ref=A614"[/URL] scrolling="no" style="width:1000px; height:1300px; border:none; margin-left:-180px; margin-top:-729px;"></iframe>
          </div>
maybe the best way to progress is to use some js that returns which browser is being used to view the page??
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top