1 reply [Last post]
Spankaj
Spankaj's picture
Offline
newbie
Last seen: 7 years 15 weeks ago
Timezone: GMT+4
Joined: 2012-02-23
Posts: 2
Points: 4

i am not able to use z-index for sub sections and its not working for me also

  <a name="nav_a11">
<div id="second" style="z-index:500; background-color:red;"><!-- $(window).scrollTop()-->
<div class="bg"  style="z-index:550; "></div>
<div class="story" style="z-index:600;background-color:yellow;" >
<!-- <div class="bg"></div>-->
  <div id="about" style="z-index:650;background-color:pink;">
       <div id='about_nav' style=" width:640px; margin:auto; z-index:99999;">
 
     <div id="about_redmore">
ience University in 2004, and then moerfer everververvved to Dubai during the same year to pursue a career in media.
<div id='expand_readmore' class="e-readmore">
erferferfks Arabic. He toured with the Axis of Evil comedy tour for a month, performing in 27 shows infront of 20,000 people collectively, in Jordan, Egypt, Kuwait, Lebanon and Dubai. 
 
</div>
<a href='#nav_a11' onClick="Show2();">read more...</a>
</div>
 
 <div style="margin:8px auto; width:610px;z-index:700; ">
 <a href='#nav_a11' style="text-decoration:none;width:150px;" id='a1' onclick="collapse_nav(this,'#St-txt')">STAND-UP COMIC</a> |
 <a href='#nav_a11' id='a2' style="text-decoration:none;" onclick="collapse_nav(this,'#tv-txt')">TV PRESENTER</a> | 
 <a href='#nav_a11' id='a3'  style="text-decoration:none;"onclick="collapse_nav(this,'#h-txt')">HOST</a> | 
 <a href='#nav_a11' id='a4' style="text-decoration:none;" onclick="collapse_nav(this,'#e-txt')">ENTERTAINER</a> | 
 <a href='#nav_a11' id='a5' style="text-decoration:none;" onclick="collapse_nav(this,'#a-txt')">ACTOR</a></div>
 
	<div id="nav_a1"  style="z-index:950; background-color:#3FF;">
       <div id="St-img" style="float:left; width:245px;margin-top:15px;margin-left:10px;">
          <img src="images/stand2.png" height="280px;">
 
       </div>
 
       <div id='St-txt' class="abtcontent1" style="z-index:950; ">
 
     <p> 
   Afterrvr erververvproduced show in Showtime Arabia's history (the region's leading pat TV network).</p>
  <p> 
Shortly after the TV series aired in the beginning of 20erfer ervertge stand up comedy performance was anonymously upload vrtvr erfjieor erfoeirf erfperf erpfmperferen sought after ever since, taking him to perform both regionally and internationally.</p>
 
 
 
       </div>
 </div>  
 
Css :
#second{
	background: url(images/Background-About.jpg) 50% 0 no-repeat fixed;
	background-color: white;
	height: 1040px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0; z-index:600;
}
#second .bg{
	background: url(images/aboutsec.png)  50% 0 no-repeat fixed;
	height: 1000px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	width: 1800px;
 
	margin-top:35px;
 
 
}
.story{
	margin: 0 auto;
	width: 980px;
}
#about	{
	border:none; 
	margin-top: 230px;
 
	width: 960px;
	min-height: 1040px;
 
	color:black;
	z-index:920; 
}
#about_content	{
	width: 900px;
	margin: 0 auto;
	min-height:inherit;
}
#about_nav a:link {font-family:'Century Gothic'; font-size:17px; font-weight:bold; text-decoration: none;}
#a1 {color:#c20121; margin-left:0px;margin-right:8px; margin-top:15px; font-weight:bold; font-size:15px;}
 

As u can see the bg image will take whole area to section"second" so my about section is not visible.......
about section contains anchor link.as u click it will open div............as bg div is overlaping about div so i am not able to click on links shown in about section............plz suggets how to solve issue,z-index is creating issue??????????

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 week 4 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

Actually i can't see it, can

Actually i can't see it, can you make it easy for us and link to an example.
z-index will have no effect if the element isn't positioned (relative or absolute).