How to create navigation button like menu?

[ljCharlie]

I want to create a vertical navigational button like menu on the left side of the page. I manage to get the look and feel the way I wanted. The problem is, I can't get the width to be the same size. It seem that the width of the background color for the text button will only go as far as the number of characters are in the button. Is there a way to make it so all the button are the same width?

Here is what I have so far.

#nav {
padding: 0;
clear: both;
float:left;
width: 150px;
margin-bottom: 0px;
background-color: #D45F00;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
font-variant: normal;
color: #FFFFFF;
margin-right: 0px;
margin-left: 0px;
text-align: left;
padding: 7px 5px;
border-bottom: 3px solid #7F0000;
border-top: 1px solid #AA0055;
}
#nav a:link, #nav a:visited{
color: #FFFFFF;
text-decoration: none;
margin: 0px;
padding-right: 5px;
padding-left: 5px;
text-transform: capitalize;
padding-top: 3px;
padding-bottom: 3px;
border-top: 2px solid #FF9900;
border-right: 1px solid #FF9900;
border-bottom: 1px solid #996600;
border-left: 1px solid #FF9900;
background-color: #CC6600;
}
#nav a:hover {
background-color: #CC6633;
border-top: 2px solid #663300;
border-right: 1px solid #CC9933;
border-bottom: 1px solid #CC9933;
border-left: 1px solid #663333;
}
#nav ul {
list-style: none;
margin: 0;
}
#nav ul li {
margin: 0 0 7px 0;
font-size: small;
}
#nav ul li ul li {
margin: 0 0 5px 15px;
}

[4css]

try this:
#nav li {
display: inline;
}
a great site to go to for playing with lists is list a matic. There are tutorials for all sorts of lists.

[kiwibrit]

Try:

#nav a {
display:block;
width:100%;
}

[a0731370]

Hi :)

Your code is a bit unordered and
hard to read. Organize your code
like this example.

[2]
#nav { 
clear: both; 
float:left; 
margin-right: 0px; 
margin-left: 0px;
margin-bottom: 0px;
padding: 7px 5px; 
width: 150px; 
background-color: #D45F00;
color: #FFFFFF;
text-align: left;
font-family: Verdana, Arial, Helvetica, sans-serif; 
font-size: 12px; 
font-weight: normal; 
font-variant: normal; 
border-bottom: 3px solid #7F0000; 
border-top: 1px solid #AA0055;} 
[/2]