html - Link is not working in the header -

html - Link is not working in the header -

when seek link on top of banner not working. thing it's wrong div z-index. couldn't it. can 1 please help me prepare . have attached related this. please utilize next link see site.

http://10.8.12.41/srilanka/ #header{ color: #cfcfcf; font-weight: 600; /*border-bottom: 4px solid #84ae03;*/ background:#fff; width: 100%; z-index: 10; } #banner{ height: 100%; margin: 0px auto 0; position: relative; width: 1000px; z-index: 1;} #topnavbar{ height: 26px; /* margin:-5px 102px 0 0;*/ position: relative; background:url(../images/top_lin.png) repeat-x; float:left; width:100%; float:right; } #topnavmenu{ float:right; width:300px; padding:3px; } #topnavmenu a{ color: #ffffff; display: inline-block; font-family: 'open sans condensed',sans-serif; font-size: 11px; font-weight: 600; /*line-height: 35px;*/ padding: 0; text-align: center; text-decoration: none; width: auto; z-index:10px; } #apdiv2 { height: 100%; margin:0px auto; position: relative; width: 1000px; z-index: 1; background:url(../images/menubg.png) repeat; background-color:#00247d; } html ------------------------------------------------ <div id="topnavbar"> <div id="topnavmenu"> <a href="#">checkmytrip</a> |<a href="#">baggage</a> | <a href="#">travel tips</a> </div> </div> <div id="banner"> <img src="images/banner.png" /> </div> <div id="apdiv2"> <!-- start css3menu.com body section id=2 --> <ul id="css3menu2" class="topmenu"> <li class="toplast"><a href="contactus.php" style="height:32px;line-height:32px;"><img src="index_files/css3menu2/contact.png" alt=""/>contact us</a></li> </ul> <p style="display:none"><a href="http://css3menu.com/">pure css dropdown menus css3menu.com</a></p> <!-- end css3menu.com body section --> <p style="display:none"><a href="http://css3menu.com/">pure css dropdown menus css3menu.com</a></p> <!-- end css3menu.com body section --> </div>

z-index on #banner of problem.

http://jsfiddle.net/jwpja/3/

#header { color: #cfcfcf; font-weight: 600; /*border-bottom: 4px solid #84ae03;*/ background:#fff; width: 100%; } #banner { height: 100%; margin: 0px auto 0; position: relative; width: 1000px; z-index: -1; } #topnavbar { height: 26px; /* margin:-5px 102px 0 0;*/ position: relative; background:url(http://placehold.it/26x26) repeat-x; width:100%; float:right; } #topnavmenu { float:right; width:300px; padding:3px; } #topnavmenu { color: #ffffff; display: inline-block; font-family:'open sans condensed', sans-serif; font-size: 11px; font-weight: 600; /*line-height: 35px;*/ padding: 0; text-align: center; text-decoration: none; width: auto; z-index:10px; } #apdiv2 { height: 100%; margin:0px auto; position: relative; width: 1000px; z-index: 1; background:url(http://placehold.it/300x300) repeat; background-color:#00247d; }

on different note, see learning because code has many things wrong it. doing here few pointers. first, float: left , float:right in same class not create sense. floating elements don't need in few places. position advanced property affects z-index in z-index not work without position , can , should used @ to the lowest degree 1 of these: top left right bottom. utilize if think need it. think layout can done without position.

a lot of people on site here not w3schools great beginner you.

keep work , better.

html css