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;
}
Also, if someone's using IE and it looks totally jank, respond with the version you're using. I'm on a Mac.
I fixed it.
This always happens like 20 seconds after I ask a question.
.pd a {
line-height: 170%;
}