I am wondering if someone can please help me with my css. Here is my code, my menu is crazy — my menu is going vertical instead of horizontal. It looks like this:
Category 1
Product 1 Product 2 Product 3
Category 2
Product 4 Product 5 Product 6
I would like it to look like
Category 1 Category 2 Category 3
and then have the items drop down when hovered over. Can someone please take a look at my css and let me know what i am doing wrong? Thank you ” title=”Smiley” />
[code:sp7d7p90].navcontainer {
height: 32px;
margin-top: 9px;
}
#nav {
height: 30px;
}
#nav, #nav ul {
padding: 0;
margin: 0;
list-style: none;
line-height: 1;
}
#nav {
margin-bottom: 1px;
padding-left: 0px;
}
#nav ul {
float: left;
list-style: none;
margin: 0px 0px 0px 0px;
padding: 0px;
}
#nav li {
float: left;
list-style: none;
margin: 0px;
padding: 0px;
}
#nav ul li {
list-style: none;
margin: 0px;
padding: 0px;
}
#nav li a, #nav li a:link {
color: #262626;
display: block;
margin: 0px 5px 0px 5px;
padding: 7px 10px;
text-decoration: none;
font-size: 13px;
font-weight: bold;
font-family: Arial, Helvetica, Sans-serif;
text-transform: uppercase;
text-shadow: 0 1px 0 #fff;
}
#nav li a:hover, #nav li a:active, .current_page_item {
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
color: #fff;
text-shadow: 0 1px 0 #000;
background-image: url(images/nav-background.png);
background-repeat: repeat-x;
}
#nav li.current_page_item a {
color:#fff;
text-shadow: 0 1px 0 #000;
}
#nav li:hover, #nav li.sfhover {
position: static;
}[/code:sp7d7p90]