Home › Forums › CSS › wordpress nav help › Re: wordpress nav help
May 25, 2012 at 12:23 pm
#103477
JPC776Participant
Try this…
#header_nav {
width:900px;
clear:left;
}
#nav_main {
list-style:none;
height:40px;
width:100%;
margin:0 auto;
text-transform: capitalize;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
}
#nav_main li {
position:relative;
float:left;
width:100px;
background:#694c8f;
text-align:center;
border-right:1px solid #9070b9;
border-left:1px solid #9070b9;
}
#nav_main a:hover {
background-color:#7e5ea7;
}
#nav_main a {
display:block;
color:#ffffff;
font-weight:bold;
text-decoration:none;
line-height:40px;
}
#nav_main a b {
position:absolute;
bottom:-1px;right:0;
border-left:12px dashed transparent;
border-bottom:12px solid #333333;
}
/*
Drop Down
*/
.sub-menu {
list-style:none;
border:0px solid #333333;
width:385px;
margin:0 auto;
text-transform: capitalize;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
}
#nav_main ul {
display:none;
list-style:none;
}
#nav_main ul li a {
padding-left:10px;
padding-right:10px;
}
#nav_main ul li {
border-right:1px solid #9070b9;
border-left:1px solid #9070b9;
width:auto;
}
#nav_main li:hover ul {
position:relative;
left:-41px;
top:auto;
display:block;
}