Center my css drop down menu - css

Question

I am attempting to center a drop down menu. You can view it here I realize this question has been asked before, but these things are so different that the answers don't really seem to apply.
This is my css
#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a
{
margin: 0;
padding: 0;
position: relative;
}
#cssmenu
{
height: 39px;
}
#cssmenu:after,
#cssmenu ul:after
{
content: '';
display: block;
clear: both;
}
.top_level{
height:40px;
}
#cssmenu a
{
height: 22px;
line-height: 26px;
padding-top: 10px;
color: white;
font-family: Georgia;
font-weight: 100;
font-size: 20px;
float: left;
padding-bottom:10px;
padding-left:17px;
padding-right: 17px;
text-decoration:none;
}
#cssmenu ul
{
list-style: none;
margin-left:auto;
margin-right:auto;
}
#cssmenu > ul
{
float: left;
}
#cssmenu > ul > li
{
float: left;
z-index: 2000;
}
#cssmenu > ul > li:hover:after
{
content: '';
display: block;
width: 0;
height: 30px;
position: absolute;
left: 50%;
bottom: 0;
z-index: 10000;
}
#cssmenu .has-sub
{
z-index: 1;
top: 0px;
left: 0px;
height: 30px;
}
#cssmenu .has-sub:hover > ul
{
display: block;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
position:absolute;
z-index:10000;
}
#cssmenu .has-sub ul
{
/*CSS for the size and position of drop down*/
display: none;
position: absolute;
width: 156px;
top: 42px;
left:-20px;
text-align:center;
background-image: url(../images/dropDown.png);
z-index:10000;
}
#cssmenu .has-sub ul li
{
*margin-bottom: -1px;
display:inline-block;
}
#cssmenu .has-sub ul li a
{
/*CSS for drop down menu*/
/*CSS for drop down menu*/
position:relative;
width:150px;
z-index:10000;
font-family:NewsCycleRegular;
font-weight: 300;
font-size: 14px;
text-align:center;
color: white;
filter: none;
display: block;
line-height: 18px;
padding: 3px;
}
#cssmenu .has-sub ul li:last-child a
{
/*CSS for last element in drop down list*/
-webkit-border-bottom-left-radius: 3px;
border-bottom-left-radius: 3px;
-webkit-border-bottom-right-radius: 3px;
border-bottom-right-radius: 3px;
z-index: 10000;
position: relative;
padding-bottom:15px;
}
#cssmenu .has-sub ul li:first-child a
{
/*CSS for last element in drop down list*/
padding-top:10px;
-webkit-border-top-left-radius: 3px;
border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
border-top-right-radius: 3px;
}
#cssmenu .has-sub ul li:hover a
{
/*Hover state for open drop down*/
}
#cssmenu .has-sub .has-sub:hover > ul
{
display: block;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
#cssmenu .has-sub .has-sub ul
{
display: none;
position: absolute;
left: 100%;
top: 0;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
#cssmenu .has-sub .has-sub ul li a
{
background: #0c7fb0;
border-bottom: 1px dotted #6db2d0;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
#cssmenu .has-sub .has-sub ul li a:hover
{
background: #095c80;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
An item wit a drop down would look like this
<li class='has-sub'><a href='surgical_specialties.php'><span>Surgery</span></a><img src="images/divider.png" />
<ul>
<li><a href='laparoscopic_surgery.php'><span>Laparoscopy</span></a></li>
<li><a href='colorectal_surgery.php'><span>Colorectal Surgery</span></a></li>
<li><a href='endoscopy.php'><span>Endoscopy</span></a></li>
<li><a href='vascular_surgery.php'><span>Vascular Surgery</span></a></li>
<li><a href='breast_surgery.php'><span>Breast Surgery</span></a></li>
<li><a href='oncologic_surgery.php'><span>Oncologic Surgery</span></a></li>
<li><a href='general_surgery.php'><span>General Surgery</span></a></li>
<li><a href='thoracic_surgery.php'><span>Thoracic Surgery</span></a></li>
</ul>
</li>

Answer 1

Assuming you mean that drop down menu is not centered with the button from which is its parents, you need to remove reset the margins and paddings of your drop down list to zero.
#cssmenu ul li ul {
margin: 0;
padding: 0;
}
Then, you should be able to go in and play with them to get them to be positioned where you want.