I frame delima

Positioning iframes in div tag

[mysticray]

Hi, I'm hoping that I'm putting this in the right place.

I own a site and have large image sliced into several small ones to make loading time easier. However I would like to put an iframe over the image where I can type/blog, whatever. This is also the frame that all my content would show up at. Anyway, I'm having a problem with the coding. I need for the iframe to be in the same place regardless of viewers screen resolution. 800x600 looks great 1027x768 is off. Is there a way with coding I can accomplish this.

This is my coding as I have it right now:

<div id="Layer1" style="position:absolute; left:432px; top:95px; width:242px; height:352px; z-index:1">
<iframe src="main.htm" frameborder="0" height="100%" width="100%" name="main" scrolling="auto"></iframe>
</div>

Any help would be appreciated.

[garann]

Hi mysticray, welcome to WebmasterWorld.

Could you elaborate on how the iframe is "off" at 1027x768? Does it not fill the entire div? What is it you want it to do?

[AWildman]

Are you trying to center it?

[mysticray]

The iframe actually moves to the left if the resolution is set at 1024x768. Where in 800x600 it's perfectly lined up it's off in the larger resolution.

[AWildman]

I'm assuming this div is not within another container div, so your iframe will always move to a position 432px left of the left side of the screen per your css.

[mysticray]

Is there a way to plant it regardless of screen size since I'm not using a table? Or is it just gonna have to be funny looking to those in large resolutions?

[AWildman]

No, it doesn't have to remain funny looking.
How about this, make the body be 100% high and wide in your style sheet. Make the text-align: center. Make a div that is exactly the width of the large background picture and set that as your background. Then, put the Layer1 div within the outer div. Remove the position: absolute if it gives you problems and replace the left: with either margin-left or padding-left. Now, since you've specified a width on the outer div, the inner div containing the iframe will be positioned relative to it.

[mysticray]

That worked perfectly. Thank you so much for your help!

Love it when I learn something new.