z-index and iframe

Question

Maigrey 0 Newbie Poster

13 Years Ago

Sorry if this is an old complaint; but I suffer from incomplete knowledge which constantly plagues me.

I would like to use iframe to solve a customization problem with a canned interface that my library is going to use to access our catalog. I got it working except for one snag -"pop out" menus (javascript changing the visibility of divs in CSS) open "under" the iframe. z-index doesn't seem to help; so I suspect that property doesn't work with iframe.

Can anyone shed some light on this or suggest a workaround? If there is any interest, I'll post some bare bones code . . .

Thanks!
Maigrey

web-design

3 Contributors
16 Replies
2K Views
1 Week Discussion Span
Latest Post 13 Years Ago Latest Post by Arkinder

All 16 Replies

Kraai 56 Senior Poster

13 Years Ago

Hi, and welcome to daniweb. Can you please give more details, as in a link to the site (my first choice) or post the code here?

Kraai 56 Senior Poster

13 Years Ago

The best is, to post your inline frame code here, and show me where your problem with it is.

Kraai 56 Senior Poster

13 Years Ago

Is this url inside the iframe correct? It seems to be dead or not existing.

http://catalog.lib.chattanooga.gov/portal.aspx

Kraai 56 Senior Poster

13 Years Ago

I copied your code and opened it in Firefox, IE and Chrome. Your popouts are visible over the iframe in both FF and Chrome, but IE is not displaying any popouts.

It seems to me that your z-index property is working correctly then with FF and Chrome.

Also, keep in mind that your css properties are linked, and not inline, so any css properties you want to inherit, you should be able to do that by using the "link" tag.

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Maigrey 0 Newbie Poster · Answer 1 · 2010-11-15T21:07:29+00:00

The javascript can be used and the scripts and css accessed from the code here - http://www.lib.chattanooga.gov; but the iframe design is not live yet. I'll post the proposed code in a subsequent message with the style properties assigned inline.

Thanks for the welcome and the quick response!

Maigrey

Maigrey 0 Newbie Poster · Answer 2 · 2010-11-16T06:42:35+00:00

Here you go. There were two errors - one really stupid one that I fixed and the hairball which turns out to be a browser issue. It now works in Firefox and Safari but not IE. You should be able to paste this into a file to see the problem; since I changed all the relative paths to full URLs. Not to worry about the coordinates of the pop-outs - I'll fix that when I know this strategy will work.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
<link href="http://www.lib.chattanooga.gov/scripts/libweb.css" rel="stylesheet" type="text/css" />
 
<script src="http://www.lib.chattanooga.gov/scripts/menus.js" language="JavaScript" 

type="text/javascript"></script>
<script src="http://www.lib.chattanooga.gov/scripts/search.js" language="JavaScript" 

type="text/javascript"></script>

<style type="text/css">
<!--
.popout { background-color:#FEF275; position:absolute; padding: 6px; left:144px; width:160px; 

text-align:left; border:1px solid #333333; z-index:10; 
}
\-->
</style> 

</head>

<body>
<div id="containerI" align="center">
<div id="LayerID">Chattanooga-Hamilton County Bicentennial Library</div>
<div id="LayerBnr"><img src="http://www.lib.chattanooga.gov/imagesT/ThePublicLibraryBnr.gif" 

alt="The Public Library" width="1002" height="100" /></div>
  <div id="LayerNavH">
<img src="http://www.lib.chattanooga.gov/imagesT/tabsG.gif" alt="Top Navigation" width="1004" 

height="30" border="0" usemap="#navMap" />
<map name="navMap" id="Map">
  <area shape="rect" coords="10,5,74,28" onmouseover="hidediv(); changeto('homeMenu')" 

href="http://www.lib.chattanooga.gov/index.html" />
  <area shape="rect" coords="88,3,193,27" onmouseover="hidediv(); changeto('demandMenu')" 

href="http://www.lib.chattanooga.gov/ondemand.html" /><area shape="rect" coords="220,5,322,25" 

onmouseover="hidediv(); changeto('teenMenu')" 

href="http://www.lib.chattanooga.gov/teenstack/index.html" /><area shape="rect" 

coords="359,6,466,25" onmouseover="hidediv(); changeto('kidsMenu')" 

href="http://www.lib.chattanooga.gov:8080" /><area shape="rect" coords="499,5,611,26" 

onmouseover="hidediv(); changeto('localMenu')" 

href="http://www.lib.chattanooga.gov/localHist/localHist.html" /><area shape="rect" 

coords="637,5,755,26" onmouseover="hidediv(); changeto('eventsMenu')" 

href="http://www.lib.chattanooga.gov/calendar.html" /><area shape="rect" coords="784,5,865,25" 

onmouseover="hidediv(); changeto('aboutMenu')" href="http://www.lib.chattanooga.gov/about.html" 

/><area shape="rect" coords="892,6,993,27" onmouseover="hidediv(); changeto('YAmenu')" 

href="http://www.lib.chattanooga.gov/cgi-bin/cw_cgi?5000+REDIRX+patronLogin_2491" />
</map>

<div id="homeMenu" class="navTbls">  
   
</div>


<div id="demandMenu" class="navTbls">
     </div>
  
<div id="teenMenu" class="navTbls"> </div>

<div id="kidsMenu" class="navTbls"> </div>

<div id="localMenu" class="navTbls"> </div>

<div id="eventsMenu" class="navTbls"> </div>
  
 <div id="aboutMenu" class="navTbls"> </div> 

<div id="YAmenu" class="navTbls"> </div>

</div>


<div id="LayerNavV">

<span class="shownlink" onmouseover="collapse();"><a 

href="http://search.ebscohost.com/login.aspx?authtype=ip,uid&amp;profile=ehis" 

class="shownlink">Search Magazine<br />Articles</a></span><br /><br />
 
 <span id="data" onmouseover="expand('LayerData'); roll_over('arrowData', 'arrow.gif');" 

onmouseout="roll_over('arrowData', 'blank.gif');"><img 

src="http://www.lib.chattanooga.gov/images/blank.gif" name="arrowData" align="right" /><a 

href="http://www.lib.chattanooga.gov/databases/DBtext.html" class="shownlink">Databases</a>  

</span><br /><br />

<span id="audio" onmouseover="expand('LayerMedia'); roll_over('arrowMedia', 'arrow.gif');" 

onmouseout="roll_over('arrowMedia', 'blank.gif');"><img 

src="http://www.lib.chattanooga.gov/images/blank.gif" name="arrowMedia" align="right" /><a 

href="http://www.lib.chattanooga.gov/databases/eAudioIntro.html" class="shownlink">Audio 

Downloads</a>  </span><br /><br />

<span id="just" onmouseover="expand('LayerJust'); roll_over('arrowJust', 'arrow.gif');" 

onmouseout="roll_over('arrowJust', 'blank.gif');"><img 

src="http://www.lib.chattanooga.gov/images/blank.gif" name="arrowJust" align="right" /><a 

href="http://www.lib.chattanooga.gov/useLibrary.html" class="shownlink">Just Arrived</a></span><br 

/><br />

<span id="soon" onmouseover="expand('LayerSoon'); roll_over('arrowSoon', 'arrow.gif');" 

onmouseout="roll_over('arrowSoon', 'blank.gif');"><img 

src="http://www.lib.chattanooga.gov/images/blank.gif" name="arrowSoon" align="right" /><a 

href="http://www.lib.chattanooga.gov/branches.html" class="shownlink">Coming Soon</a></span><br 

/><br />

<span id="mov" onmouseover="expand('LayerMov'); roll_over('arrowMov', 'arrow.gif');" 

onmouseout="roll_over('arrowMov', 'blank.gif');"><img 

src="http://www.lib.chattanooga.gov/images/blank.gif" name="arrowMov" align="right" /><a 

href="http://www.lib.chattanooga.gov/localHist/guide.html" class="shownlink">Movies </a></span><br 

/>
<br />

<span id="mus" onmouseover="expand('LayerMus'); roll_over('arrowMus', 'arrow.gif');" 

onmouseout="roll_over('arrowMus', 'blank.gif');"><img 

src="http://www.lib.chattanooga.gov/images/blank.gif" name="arrowMus" align="right" /><a 

href="http://www.lib.chattanooga.gov/govDocs/index.html" class="shownlink">Music</a></span><br />
<br />

<span id="path" onmouseover="expand('LayerPath'); roll_over('arrowPath', 'arrow.gif');" 

onmouseout="roll_over('arrowPath', 'blank.gif');"><img 

src="http://www.lib.chattanooga.gov/images/blank.gif" name="arrowPath" align="right" /><a 

href="http://www.lib.chattanooga.gov/pathfinders/pathfinders.html" 

class="shownlink">Pathfinders</a></span><br /><br />

<span id="serv" onmouseover="expand('LayerServ'); roll_over('arrowServ', 'arrow.gif');" 

onmouseout="roll_over('arrowServ', 'blank.gif');"><img 

src="http://www.lib.chattanooga.gov/images/blank.gif" name="arrowServ" align="right" /><a 

href="http://www.lib.chattanooga.gov/services.html" class="shownlink">More Services</a></span><br 

/><br />

<span id="about" onmouseover="expand('LayerAbout'); roll_over('arrowAbout', 'arrow.gif');" 

onmouseout="roll_over('arrowAbout', 'blank.gif');"><img 

src="http://www.lib.chattanooga.gov/images/blank.gif" name="arrowAbout" align="right" /><a 

href="http://www.lib.chattanooga.gov/about.html" class="shownlink">About the Library</a></span><br 

/><br />

<span id="sup" onmouseover="expand('LayerSup'); roll_over('arrowSup', 'arrow.gif');" 

onmouseout="roll_over('arrowSup', 'blank.gif');"><img 

src="http://www.lib.chattanooga.gov/images/blank.gif" name="arrowSup" align="right" /><a 

href="http://www.lib.chattanooga.gov/support/support.html" class="shownlink">Support 

Us</a></span><br /><br />

<span id="sup" onmouseover="collapse();"><a href="http://www.lib.chattanooga.gov/contact.html" 

class="shownlink">Contact Us</a></span>
</div>

<div id="LayerSlgn"><strong>"Our mission is to excite the community about the many resources and 

experiences they’ll discover in books and
beyond"</strong></div>

<div id="LayerData" class="popout">
<a href="http://www.lib.chattanooga.gov/databases/DBintro.html" class="hiddenlink">How To Search For 

Articles</a><br />
  <a 

href="http://search.ebscohost.com/login.aspx?authtype=ip,cpid&custid=s5119768&profile=autorefctr" 

class="hiddenlink">Auto Reference Center</a><br /> 
 <a href="http://www.lib.chattanooga.gov/databases/DBtext.html#elem" class="hiddenlink">Children's 

Programs</a><br />
 <a href="http://search.ebscohost.com/login.aspx?authtype=ip,cpid&custid=s5119768&profile=ehis" 

class="hiddenlink">EbscoHost Research Database</a><br />
 <a href="http://www.lib.chattanooga.gov/databases/DBtext.html#local" class="hiddenlink">Local 

Information</a><br />
 <a href="http://www.lib.chattanooga.gov/localHist/photodatabase.html" 

class="hiddenlink">Photographs</a><br />
 <a href="http://www.learningexpresslibrary.com" class="hiddenlink">Practice Tests - Learning 

Express</a><br />
 <a href="http://infotrac.galegroup.com/galenet/tel_p_chcbl" class="hiddenlink">Tennessee Electronic 

Library<br /></a></div>

<div id="LayerMedia" class="popout">
<a href="http://www.lib.chattanooga.gov/databases/eAudioIntro.html" class="hiddenlink">Intro to 

eAudio Use</a><br />
<a href="http://www.lib.chattanooga.gov/databases/validate1C.html" 

class="hiddenlink">NetLibrary</a><br />
<a href="http://chcbl.lib.overdrive.com" class="hiddenlink">Overdrive</a></div>

<div id="LayerUse" class="popout">
<a href="http://www.lib.chattanooga.gov/helpFiles/callNumbers.html" class="hiddenlink">How To Find 

It With a Call Number</a><br />
<a href="http://www.lib.chattanooga.gov/circ/circ.html" class="hiddenlink">Checking Out Books</a><br 

/>
      <a href="http://www.lib.chattanooga.gov/ondemand.html" class="hiddenlink">On 

Demand/Rental</a><br />
	  <a href="http://www.lib.chattanooga.gov/services.html#computers" 

class="hiddenlink">Computers</a><br />
      <a href="http://www.lib.chattanooga.gov/librarycards.html" class="hiddenlink">Library 

Cards</a><br />
      <a href="http://www.lib.chattanooga.gov/services.html#ill" class="hiddenlink">Interlibrary 

Loan Info</a><br />
    <a href="http://www.lib.chattanooga.gov/services.html#fax" class="hiddenlink">Information by 

Mail &amp; Fax</a><br />
     <a href="http://chcbl.countingopinions.com" class="hiddenlink">Please Take Our SURVEY</a></div>
	 
<div id="LayerLoc" class="popout">
<a href="http://www.lib.chattanooga.gov/googleMap.html" class="hiddenlink">Map</a><br />
<a href="http://www.lib.chattanooga.gov/main.html" class="hiddenlink">Downtown</a><br />
    <a href="http://www.lib.chattanooga.gov/eg/eg.html" class="hiddenlink">Eastgate</a><br />
    <a href="http://www.lib.chattanooga.gov/ng/ng.html" class="hiddenlink">Northgate</a><br />
    <a href="http://www.lib.chattanooga.gov/oc/oc.html" 

class="hiddenlink">Ooltewah-Collegedale</a><br />
    <a href="http://www.lib.chattanooga.gov/sc/sc.html" class="hiddenlink">South Chattanooga</a><br 

/>
    <a href="http://www.lib.chattanooga.gov/cd/cd.html" class="hiddenlink">Creative Discovery 

Museum</a></div>
	
<div id="LayerSubj" class="popout">
<a href="http://www.lib.chattanooga.gov/bst/bst.html" class="hiddenlink">Business, 
    <br />
  Science &amp; Technology</a><br />
    <a href="http://www.lib.chattanooga.gov/childDpt/childDpt.html" 

class="hiddenlink">Children's</a><br />
    <a href="http://www.lib.chattanooga.gov/fineArts.html" class="hiddenlink" 

style="text-decoration: none">Fine 
    Arts</a><br />
    <a href="http://www.lib.chattanooga.gov/localHist/localHist.html" class="hiddenlink">Local 

History</a>
	<a href="http://www.lib.chattanooga.gov/reference/reference.html" 

class="hiddenlink">Reference & Information</a></div>
	
<div id="LayerProg" class="popout">	
	<a href="http://www.lib.chattanooga.gov/calendar.html" class="hiddenlink">Calendar of 

Events</a><br />
	<a href="http://www.lib.chattanooga.gov/prog/prog.html#anime" 

class="hiddenlink">Anime</a><br />
    <a href="http://www.lib.chattanooga.gov/childDpt/childPrgms.html" class="hiddenlink">Children's 

Programs</a><br />
    <a href="http://www.lib.chattanooga.gov/prog/prog.html" class="hiddenlink"> Cinema @ the 

Library</a><br />
    <a href="http://www.lib.chattanooga.gov/prog/prog.html#genealogy" class="hiddenlink"> Genealogy 

Classes</a><br />
<a href="http://www.lib.chattanooga.gov/lrc/learningResource.html" class="hiddenlink"> Learning 

Resource Center</a><br />
<a href="http://www.lib.chattanooga.gov/teenstack/index.html" class="hiddenlink"> Teen 

Programs</a><br />
<a href="http://www.lib.chattanooga.gov/Wise/WISE.html" class="hiddenlink"> WISE</a><br />
	 <a href="http://chcbl.countingopinions.com" class="hiddenlink">Please Take Our 

SURVEY</a></div>
	
<div id="LayerGov" class="popout">	
	<a href="http://www.lib.chattanooga.gov/govDocs/state.html#Chatt" class="hiddenlink">City 
    of Chattanooga</a><br />
    <a href="http://www.lib.chattanooga.gov/govDocs/state.html#HamCo" class="hiddenlink">Hamilton 

County</a><br />
    <a href="http://www.lib.chattanooga.gov/govDocs/state.html#TN" 

class="hiddenlink">Tennessee</a><br />
    <a href="http://www.lib.chattanooga.gov/govDocs/index.html" class="hiddenlink" 

style="text-decoration: none">U.S 
    Government</a><br />
	<a href="http://www.lib.chattanooga.gov/bst/passports.html" class="hiddenlink">U.S. 

Passports</a></div>
	
<div id="LayerPath" class="popout">
 <a href="http://library.booksite.com/7147/" class="hiddenlink">Good Reads</a><br/>
	<a href="http://www.lib.chattanooga.gov/pathfinders/multimedia.html" 

class="hiddenlink">Multimedia Lists</a><br />
    <a href="http://www.lib.chattanooga.gov/bib/bib.html" class="hiddenlink">Book Lists</a><br />
    <a href="http://www.lib.chattanooga.gov/webLinks/helpfullinks.html" class="hiddenlink">Helpful 

Websites</a></div>
	
<div id="LayerServ" class="popout">	
	<a href="http://www.lib.chattanooga.gov/services.html#computers" 

class="hiddenlink">Computers</a><br />
    <a href="http://www.lib.chattanooga.gov/notary.html" class="hiddenlink">Notary Service</a><br />
    <a href="http://www.lib.chattanooga.gov/bst/passports.html" class="hiddenlink">Passports</a> <br 

/>
    <a href="http://www.lib.chattanooga.gov/services.html#meetingRm" class="hiddenlink">Meeting 

Rooms</a><br />
    <a href="http://www.lib.chattanooga.gov/services.html#fax" class="hiddenlink">Information by 

Mail &amp; 
    Fax</a><br />
	 <a href="http://chcbl.countingopinions.com" class="hiddenlink">Please Take Our 

SURVEY</a></div>
	
<div id="LayerAbout" class="popout">	
	<a href="http://www.lib.chattanooga.gov/directors.html" 

class="hiddenlink">Administration</a><br />
  <a href="http://www.lib.chattanooga.gov/calendar.html" class="hiddenlink">Calendar of 

Events</a><br />
    <a href="http://www.lib.chattanooga.gov/contact.html" class="hiddenlink">Contact Us</a><br />
    <a href="http://www.lib.chattanooga.gov/employment.html" class="hiddenlink">Employment</a><br />
    <a href="http://www.lib.chattanooga.gov/faq.html" class="hiddenlink">FAQ</a><br />
    <a href="http://www.lib.chattanooga.gov/hours.html" class="hiddenlink">Hours</a><br />
	<a href="http://www.lib.chattanooga.gov/policy.html" class="hiddenlink">Library 

Policies</a><br />
	 <a href="http://chcbl.countingopinions.com" class="hiddenlink">Please Take Our 

SURVEY</a></div>
  
  <div id="LayerSup" class="popout">
  <a href="http://www.friendsofthelibrary-chattanooga.com/book-sales.html" class="hiddenlink">Used 

Book Sales</a><br />
    <a href="http://www.friendsofthelibrary-chattanooga.com/" class="hiddenlink">Friends of the 

Library</a><br />
    <a href="http://www.friendsofthelibrary-chattanooga.com/gifts-and-donations.html" 

class="hiddenlink">Gifts &amp; Donations</a><br />
    <a href="http://www.lib.chattanooga.gov/support/endowment.html" class="hiddenlink">Endowment 

Fund</a><br />
	 <a href="http://chcbl.countingopinions.com" class="hiddenlink">Please Take Our 

SURVEY</a></div>


	 
<div id="LayerContentI" onmouseover="collapse();">

<iframe src="http://catalog.lib.chattanooga.gov/portal.aspx" style="margin-left:10; border:0; 

z-index:9; overflow:hidden; height: 480px; width: 100%;"></iframe></div></div>
<html>

Maigrey 0 Newbie Poster · Answer 3 · 2010-11-16T20:39:55+00:00

Yes, I discovered a second error that was causing the problem in FF and Safari. That was what I was mentioning in the paragraph preceding my code in my last post. Notice, if you comment out the iframe, you'll see that the pop-outs are there - they just open under the iframe even though the z-index property should prevent it. Not to worry about the dead link in the iframe - that isn't live yet. You can substitute http://www.lib.chattanooga.gov/notary.html if you want to see something live in there.

Kraai 56 Senior Poster Featured Poster · Answer 4 · 2010-11-16T21:05:44+00:00

I can see the pop-outs now in IE on top of the iframe, same as with FF, no problem on my IE browser anymore. The reason I could not see them in IE previously, was because IE blocked the running of ActiveX scripts.I allowed it on IE, and your z-index is placing the pop-outs nicely over the iframe now.

Maigrey 0 Newbie Poster · Answer 5 · 2010-11-16T21:18:31+00:00

Ah, so this could be a local problem for both of us. I wonder if it is appropriate to expect public library patrons to have Active X scripts allowed. We'd probably endlessly get lots of support calls about it; or flack from those responsible for network security at the library. Looks like I'm into a policy discussion over that one.

I'll keep this open for a little while longer in case anyone thinks of a plain code work-around.

Kraai 56 Senior Poster Featured Poster · Answer 6 · 2010-11-16T21:37:40+00:00

In IE, as a security measure, running some scripts like ActiveX is turned off by default. When one visits a website running those scripts, it is your choice to allow them, if you trust the website, by clicking allow on the pop-up warning, or on the pop-up blocker if you block pop-ups.

I would suggest, if possible, to re-write your script, using css to have a sub-menu slide out effect.

Maigrey 0 Newbie Poster · Answer 7 · 2010-11-23T02:07:46+00:00

Solved! It wasn't a local problem; I found documentation in another forum that there is a z-index bug in IE (supposed to be older versions; but I found it still manifested itself in IE8) that resets the z-index when it is a style property of an iframe. The easy-as-pie workaround is to reorder the relative positions of the divs in the code; so that the iframe is listed in the correct order - that it, it is listed before the pop-outs so it remains under them when they become visible.

For my situation, I also had to make a slight change in the javascript controling the pop-outs; so the right set of divs were being affected by it; but that was also simple to do.

Maigrey 0 Newbie Poster · Answer 8 · 2010-11-23T02:16:00+00:00

Maigrey 0 Newbie Poster

13 Years Ago

oops.

Edited 13 Years Ago by Maigrey because: duplication

Arkinder 93 Posting Pro in Training · Answer 9 · 2010-11-23T04:41:49+00:00

I accidentally posted before finishing. I'll edit with completed post in a moment.

Arkinder 93 Posting Pro in Training · Answer 10 · 2010-11-23T05:28:31+00:00

I was born in Hamilton County so I hope you don't mind if I offer another work around. One that doesn't require z-index at all (this is based off of the code you provided - not the link). :)

Let's begin with your division that has the id "containterI".

Remove the align attribute. It's deprecated and not really doing anything.
Remove the 'position: relative;' from your CSS. You'll notice the division is centered while the content is not.

Now remove the position style from the following divisions, listed by their corresponding id.

LayerID
LayerBnr
LayerNavH
LayerNavV
LayerSlgn
and LayerContentI

At this point a few elements are thrown all over the place, and we'll get to that in a moment. For now let's do a little housekeeping.

In your division "LayerID"s CSS remove the float property.
In your division "LayerNavH"s CSS remove the clear property. Since there is no longer a floating element this isn't really needed.
In your .navTbls rule remove the 'left: 2px;' and 'top: 30px', but leave 'position: absolute;'. This will keep the changing divisions in the same place.

Now your division with the id "LayerNavV" is positioned where we would like it, but now we need to make it play well with the other elements on the page. Specifically your division with the id "LayerSlgn". We are simply going to add 'float: left;" into "LayerNavV"s CSS. Now if "LayerSlgn" was visible it would be exactly where we want it. Remove the 'width: 860px;' from "LayerSlgn"s CSS.

Now for the iframe that has been shoved to the bottom. This is happening because the iframe's width is too large to fit within the amount of space left. To fix this we need to,

In the division with the id "LayerContentI" remove the 'width: 860px;' and change 'height: 480px;' to 481px. This will make the content line up with the side navigation bar.
In the iframe's inline styles you need to alter:
- 'z-index: 9;' this is no longer needed.
- change 'width: 100%;' to 843px. Now the division is small enough to fit within given space.

z-index can now be removed from your .popout rule. Then in the .popout rule change 'left: 144px' to 259px, or however far over you think is best. Now all that's left is playing around with the top property for each popout until you find the distance from the top that you like.

I've included a screen shot of what the finished product looks like. If you have any problems or would like something further explained, feel free to ask. Also, I recommend fixing the 32 erros in your code. They can be found by pasting the code here.

Regards, Arkinder

Maigrey 0 Newbie Poster · Answer 11 · 2010-11-23T20:38:43+00:00

Thanks, Arkinder. That was the most complete analysis that I have ever received in a forum! No doubt, a bunch of these errors have been hanging around from before the current redesign and I'll certainly work on the deprecated and incorrect junk that is still in there.

Maigrey

Arkinder 93 Posting Pro in Training · Answer 12 · 2010-11-24T02:02:18+00:00

Arkinder 93 Posting Pro in Training

13 Years Ago

No problem, and good luck.

z-index and iframe

Recommended Answers Collapse Answers

All 16 Replies

Recommended Answers