Center Menu Text

[JustMe65]

I am using the menu from this page:

http://www.dynamicdrive.com/style/csslibrary/item/jquery_drop_line_menu/

I need to center the text of the horizontal sub menu and cannot get this to work. When I add a sub menu the text is placed to the left with a long menu bar full of space the width of my page. I know it's something simple I am overlooking...ugh....

Here is my CSS code for the menu:


.droplinebar{
overflow: hidden;
height: 38px;
background-image: url(images/navbar.gif);
background-repeat: no-repeat;
}

.droplinebar ul{
margin: 0 auto;
padding: 0;
width: 92%;
font: 15px Georgia;
background: center center repeat-x; /*default background of menu bar*/
height: 38px;
}

.droplinebar ul li{
display: inline;
}

.droplinebar ul li a{
float: left;
color: white;
padding: 10px 40px;
text-decoration: none;
}

.droplinebar ul li a:visited{
color: white;
}

.droplinebar ul li a:hover, .droplinebar ul li .current{ /*background of main menu bar links onMouseover*/
color: white;
background: transparent url(images/navhover.gif) center center repeat-x;
}

/* Sub level menus*/
.droplinebar ul li ul{
position: absolute;
z-index: 200;
left: 0;
top: 0;
background: url(images/navhoverblack.png); /*sub menu background color */
visibility: hidden;
}

/* Sub level menu links style */
.droplinebar ul li ul li a{
font: normal 15px Georgia;
padding: 10px;
padding-right: 20px;
margin-left: 20px;
}

.droplinebar ul li ul li a:hover{ /*sub menu links' background color onMouseover */
background: transparent url(images/navhover.gif) center center repeat-x;
}

[deathbycheese]

Did you try

text-align:center;
in your /* Sub level menu links style */?

[JustMe65]

Yes I tried that and the sub menu text is still aligned to the left. With five or six menu titles it doesn't look so bad. When there are only two menu titles it looks quite odd having the two menu titles all the way to the left.