dropdown menu question
Posted: Tue Jun 03, 2008 8:10 pm
Hello, it's me again with a menu question. I solved the simple horizontal navigation issue. Now I am trying to get a dropdown menu to work. I have been reading and searching and reading and searching, but i cannot seem to figure it out.
This is in my template:
{menu template="cssmenu.tpl"}
this is in css:
#menuwrapper {
float:left;
margin-bottom: 30px;
width:1000px;
}
ul#primary-nav
{ margin:0; padding:1px 0; list-style:none; width:100%; height:21px; border-top:1px solid #fa9336; border-bottom:1px solid #fa9336; font:normal 8pt verdana, arial, helvetica;}
ul#primary-nav li
{ margin:0; padding:0; display:block; float:left; position:relative; width:112px; }
ul#primary-nav li a:link,
ul#primary-nav li a:visited
{ padding:4px 0; display:block; text-align:center; text-decoration:none; background:#fa9336; color:#ffffff; width:112px; height:13px; }
ul#primary-nav li:hover a,
ul#primary-nav li a:hover,
ul#primary-nav li a:active
{ padding:4px 0; display:block; text-align:center; text-decoration:none; background:#f7caa2; color:#ffffff; width:110px; height:13px; border-left:1px solid #ffffff; border-right:1px solid #ffffff; }
ul#primary-nav li ul.menuparent
{ margin:0; padding:1px 1px 0; list-style:none; display:none; background:#ffffff; width:110px; position:absolute; top:21px; left:-1px; border:1px solid #fa9336; border-top:none; }
ul#primary-nav li:hover ul.menuparent
{ display:block; }
ul#primary-nav li ul.menuparent li
{ width:100px; clear:left; width:110px; }
ul#primary-nav li ul.menuparent li a:link,
ul#primary-nav li ul.menuparent li a:visited
{ clear:left; background:#fa9336; padding:4px 0; width:110px; border:none; border-bottom:1px solid #ffffff; position:relative; z-index:1000; }
ul#primary-nav li ul.menuparent li:hover a,
ul#primary-nav li ul.menuparent li a:active,
ul#primary-nav li ul.menuparent li a:hover
{ clear:left; background:#f7caa2; padding:4px 0; width:110px; border:none; border-bottom:1px solid #ffffff; position:relative; z-index:1000; }
Maybe there is someone here who can see in a glance what i am doing wrong....
Thanks heaps
This is in my template:
{menu template="cssmenu.tpl"}
this is in css:
#menuwrapper {
float:left;
margin-bottom: 30px;
width:1000px;
}
ul#primary-nav
{ margin:0; padding:1px 0; list-style:none; width:100%; height:21px; border-top:1px solid #fa9336; border-bottom:1px solid #fa9336; font:normal 8pt verdana, arial, helvetica;}
ul#primary-nav li
{ margin:0; padding:0; display:block; float:left; position:relative; width:112px; }
ul#primary-nav li a:link,
ul#primary-nav li a:visited
{ padding:4px 0; display:block; text-align:center; text-decoration:none; background:#fa9336; color:#ffffff; width:112px; height:13px; }
ul#primary-nav li:hover a,
ul#primary-nav li a:hover,
ul#primary-nav li a:active
{ padding:4px 0; display:block; text-align:center; text-decoration:none; background:#f7caa2; color:#ffffff; width:110px; height:13px; border-left:1px solid #ffffff; border-right:1px solid #ffffff; }
ul#primary-nav li ul.menuparent
{ margin:0; padding:1px 1px 0; list-style:none; display:none; background:#ffffff; width:110px; position:absolute; top:21px; left:-1px; border:1px solid #fa9336; border-top:none; }
ul#primary-nav li:hover ul.menuparent
{ display:block; }
ul#primary-nav li ul.menuparent li
{ width:100px; clear:left; width:110px; }
ul#primary-nav li ul.menuparent li a:link,
ul#primary-nav li ul.menuparent li a:visited
{ clear:left; background:#fa9336; padding:4px 0; width:110px; border:none; border-bottom:1px solid #ffffff; position:relative; z-index:1000; }
ul#primary-nav li ul.menuparent li:hover a,
ul#primary-nav li ul.menuparent li a:active,
ul#primary-nav li ul.menuparent li a:hover
{ clear:left; background:#f7caa2; padding:4px 0; width:110px; border:none; border-bottom:1px solid #ffffff; position:relative; z-index:1000; }
Maybe there is someone here who can see in a glance what i am doing wrong....
Thanks heaps