0

Hello,
I have a simple page that consists of an image, some map hotspots, and an iframe that displays content when the hotspots are clicked:

<div id="wrapper">
<img src="blah.gif" />
...
some <area...target="iFrame"> tags
...
<iframe id="iFrame" src="home.htm">No iframe support!</iframe>
</div>

With the wrapper naturally aligning to the top/left of the browser window, the iFrame is aligned correctly in relation to this.

However, I want to center the image on the web page. When I align="center" the wrapper div, the iFrame stays where it is - misaligned.

When the browser page is adjusted and the wrapper div centers in the new browser window, how can I ensure that the iFrame position adjusts to maintain its position relative to the wrapper?

Thanks

2
Contributors
4
Replies
5
Views
9 Years
Discussion Span
Last Post by welshbaloney
0

Thanks for replying JonathanD,
I'm not sure what you're referring to. Can you offer an example?

Thanks
Tony.

0

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><style>a:link,a:visited,a:hover,a:active{color:#0000ff;cursor:pointer;}body,table,div,ul,li{font-size:10px;margin:0px;padding:0px}body{background-color:transparent;font-family:arial,sans-serif;height:100%}#aus{height:250px;width:300px}#ads{left:2px;position:absolute;top:2px;width:296px}#ads ul{list-style:none;}#ads ul li{clear:both;float:left;height:116px;overflow:hidden;width:296px}.ad{margin:0px 2px}.adt{font-size:13px;font-weight:bold;line-height:14px;}.adb{color:#000000;display:block;font-size:13px;line-height:14px;}.adu{color:#009900;font-size:10px;line-height:12px;overflow:hidden;white-space:nowrap}.adus{cursor:pointer;}.adc{width:100%;height:116px;table-layout:fixed;overflow:hidden}#abgi{left:220px;position:absolute;top:233px}#aubg{background-color:#ffffff;border:0px solid #ffffff;display:none;height:250px;width:300px}.bg{background-color:#ffffff;border-color:#ffffff;border-style:solid;border-width:0px;height:18px;position:absolute;width:18px}#tlc{background-color:#ffffff;border-left-width:0px;border-top-width:0px;left:0px;top:0px}#trc{background-color:#ffffff;border-right-width:0px;border-top-width:0px;left:282px;top:0px}#blc{background-color:#ffffff;border-bottom-width:0px;border-left-width:0px;left:0px;top:232px}#brc{background-color:#ffffff;border-bottom-width:0px;border-right-width:0px;left:282px;top:232px}#bgtf{border-top-width:0px;left:18px;top:0px;width:264px}#bgbf{border-bottom-width:0px;left:18px;top:232px;width:264px}#bgcf{border-left-width:0px;border-right-width:0px;height:214px;left:0px;top:18px;width:300px}</

something like that, inline CSS might work.

0

Ah...so you mean explicitly putting the CSS into the file rather than external in a .css file.
I'll give that a try. Thanks for helping.

Tony.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.