3 {{ upvoteCount | shortNum }}
3 {{ upvoteCount | shortNum }}

help with side nav

by mezner
2 replies
  • WEB DESIGN
    • |
It has been a while since I started creating websites from scratch and I'm having a little issue with one part of my design. I'm making a side navigation (vertical) and want to have buttons, each button to be 144px wide, 50px tall and have a vertical spacing of about 60px each.

I don't know what I'm doing or why this is happening, but the code ends up giving me double the boxes that my HTML actually asks for. I've never really done vertical menus, so I really don't know whats wrong. Check the css out and tell me whats wrong.

if someone gave me the correct code, that would be much appreciated too.

Code:
.sidenav {
    width: 144px;
    height: 734px;
    float: left;
    margin: 0 auto 0 20px;
    padding: 0;
    background: #ff9933;
    background: url(images/sidenav.jpg) no-repeat;
}
.sidenav ul{
    list-style-type:none;
    margin:0;
    padding:0;
}
.sidenav li {
    padding: 0;
    margin: 0;
    height: 39px;
    list-style: none;
    background-repeat: no-repeat;
    margin: 0 0 50px 0;
}
.sidenav li a, .sidenav li a:visited {
    display: block;
    text-decoration: none;
    text-indent: -9999px;
    height: 39px;
    background-repeat: no-repeat;
    background: #ff9933;
    border: 1px solid #ffffff;
}
edit: I know it's the margins under the .sidenav li, because when I get rid of that the boxes are just fine, only there is no clear spacing between them.
#nav #side

Trending Topics