Welcome Guest [Log In] [Register]
Search Members Calendar | Rules ZB Code Index IF Code Index
ZBCode
  • Navigation
  • ZBCode
  • Coding Support
  • Code University
  • can I get help with a drop menu?
Hey, welcome to ZBCode, the premier coding forum for ZB. Here you fill find some of the best Invisionfree and Zetaboards Codes on the network! Unfortunately, you're sorta hovering around in guest mode at the moment; why not join in on the fun? Register an account and you can start accessing the wealth of resources we have available here. Enjoy your stay at ZBCode, and remember to tell all your friends about us; the more members, the more codes available. ;)

Interested in joining? Click here.


If you are already a member of ZBCode, feel free to login right here:

Username:   Password:
Locked Topic
can I get help with a drop menu?
Tweet Topic Started: Nov 7 2008, 05:11 PM (159 Views)
lirts Nov 7 2008, 05:11 PM Post #1


Posts:
204
Group:
Member
Member
#207
Joined:
Jul 22, 2008
Coding language
HTML/CSS
I'm trying to code this drop menu, it works properly in FF but in IE the drop menu floats to the left when its supposed to "drop" any help?

the menu:
Code:
 
<!-- drop menu start -->
<div id="dropmenu">

<!-- block -->
<div id="dropmenulinks">
<div class="dropmenulinks">
<ul>
<li><h2 class="special">option 1</h2>
<ul>
<div class="dropmenuwraplinks">
<li><a href="#">link 1</a></li>
</div>
</ul>
</li>
</ul>
</div>
</div>
<!-- block end -->

<!-- block -->
<div id="dropmenulinks">
<div class="dropmenulinks">
<ul>
<li><h2 class="special">option 2</h2>
<ul>
<div class="dropmenuwraplinks">
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
</div>
</ul>
</li>
</ul>
</div>
</div>
<!-- block end -->

<!-- block -->
<div id="dropmenulinks">
<div class="dropmenulinks">
<ul>
<li><h2 class="special">option 3</h2>
<ul>
<div class="dropmenuwraplinks">
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
<li><a href="#">link 3</a></li>
</div>
</ul>
</li>
</ul>
</div>
</div>
<!-- block end -->

</div>
<!-- drop menu end -->


the CSS:
Code:
 
/* Drop Menu made by Lirts*/
.dropmenuwraplinks {
border:1px solid #E7E7E7;
border-top:none;
margin-left:0;
margin-right:0.8px;
}

.dropmenulinks {
background-color: #F6F6F6;
padding:0!important;
text-align: center;
}

.dropmenulinks a {
display: block;
padding: 2px 5px;
border-top: 1px solid #E7E7E7;
border-bottom: 1px solid #fff;
text-decoration: none!important;
font-size:10px!important;
width:92.8%;
height:100%;
}

.dropmenulinks a:hover {
text-decoration: none;
border-top: 1px solid #FB9D3A;
border-bottom: 1px solid #FB9D3A;
}

#dropmenu h2.special {
background:url(http://z3.ifrm.com/static/1/css/h2s.png) repeat-x top #FB9D3A;
color:#fff;
font-size: 100%;
font-weight:400;
padding:0px 4px!important;
margin:0;
border: 1px solid #E77700;
border-bottom:none;
width:92.5%;
}

#dropmenu {
width: 100%;
background:none;
float: left;
margin-bottom:30px;
}

#dropmenu ul {
list-style: none;
margin: 0;
padding: 0;
width: 12em;
float: left;
}

#dropmenu li {
position: relative;
}

#dropmenu ul ul {
position: absolute;
z-index: 3;
}

div#dropmenu ul ul,
{display: none;}

div#dropmenu ul li:hover ul,
{display: block;}
"We fear that which we do not see."

"Our minds are limited by what we know, not what we believe."
Posted Image
Legion of Shadows! Join The Community! Join The RP! Join the Legion!! Click the pic to view!

Offline Profile Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
« Previous Topic · Code University · Next Topic »
Locked Topic

Track Topic · E-mail Topic Time: 7:45 PM Jul 10
Hosted for free by ZetaBoards · Privacy Policy