CSS alignment help?

Take a look at this URL:

http://msu.edu/~zoppacod/alpha/self.html

I'm trying to get the text of the menu items to center perfectly on background image. I tried vertical-align in the .pd a element, but that didn't seem to work. Here's the CSS.

.txt_description {
color:#FFFFFF;
}

.pd {
text-align:center;
}

.pd a {
color: #FFFFFF;
text-decoration:none;
}

.pd li {
margin-left: -40px;
}

.pd li:hover {
background-image:url(graphics/lidown.gif);
}

.pd li:hover > ul li {
visibility: visible
}

.pd ul {
list-style-type:none;
}

.pd li {
width: 100px;
height: 25px;
background-image:url(graphics/liup.gif);
}

.pd ul ul li {
width: 80px;
height: 20px;
font-size: x-small;
background-image:url(graphics/liulliup.gif);
}

.pd ul ul li:hover {
background-image:url(graphics/liullidown.gif);
}

.pd ul ul {
visibility: hidden;
margin-left: 90px;
margin-top: -20px;
position: absolute;
z-index: 1;
}

2008-03-02T13:32:39Z

Also, if someone's using IE and it looks totally jank, respond with the version you're using. I'm on a Mac.

2008-03-02T13:35:07Z

I fixed it.

This always happens like 20 seconds after I ask a question.

.pd a {
line-height: 170%;
}

ArmchairPilot2008-03-03T12:28:57Z

Favorite Answer

If you've fixed it yourself, then delete the question!!