<div> positioning making problems in IE iframe

**mac41** · 07-28-2005, 07:01 PM

I finally fixed the <div> positioning so that it worked the same in both IE and Mozilla, and have ended up with a very simple <div> positioning code. In IE, however, my iframe is acting very strangely, and the page being shown gets arranged funny. The way it ought to be has two images, one on top of the other, and then some text, the way IE shows it, though, everything is on the same line, the two images next to each other and then the text.

I checked that it wasn't from my style CSS within the <head> of the page, so it must be something I'm missing in my <div> tags.

This is the basic positioning code:

Code:

<head>
<style media="all" type="text/css">
      html, body {
         height: 100%; overflow: hidden;
      }

      #div1 { position: absolute; top: 0; left: 0; z-index: 1; }
      #div2 { position: absolute; top: 0; left: 20; z-index: 1; }
      #div3 { position: absolute; top: 130; left: 200; z-index: 1; }
      #div4 { position: absolute; top: 145; left: 59; z-index: 1; }
      #div5 { position: absolute; top: 70; left: 130; z-index: 1; }
      #div6 { position: absolute; top: 531; left: 120; z-index: 1; }
</style>
</head>
<body>


<div id="div1">
Image
</div>

<div id="div2">
Image
</div>

<div id="div3">
Navigation
</div>

<div id="div4">
<IFRAME name="iframe" src="link" width=716 height=378 marginwidth=0 marginheight=0 frameborder=1 scrolling=auto></IFRAME>
</div>

<div id="div5">
Image
</div>

<div id="div6">
<IFRAME name="nav" src="link" width=600 height=19 marginwidth=0 marginheight=0 frameborder=0 scrolling=no></IFRAME>
</div>

</body>

The issue is only relevant to the first iframe, although I'm not sure if it effects the second. The pages shown in the second are only text to begin with, there's no positioning.

Can anyone see where the problem is? It works fine in Mozilla.

**jatkinson10** · 08-01-2005, 07:35 PM

Try not using absolute positioning and use the box model to give the page it's layout. This will allow you to have a almost exact representation in both browsers. By using padding and margins I was able to place a I frame in this site that looks great in both FF and IE example

J.

Thread: <div> positioning making problems in IE iframe

Thread Tools

Search Thread

<div> positioning making problems in IE iframe

Bookmarks

Bookmarks

Posting Permissions