Css vertical centering issues

programming web dev
1

Im having trouble centering my meny items in a css drop down menu. This is what it looks like now:
http://www.olssongerthel.se/site/index.html

I’m trying to vertically align all the menu items (Start, Butik etc.) to the middle of the 100x100 box but I can’t seem to make it work. Does anyone know what the problem is?

this is the css for the menu:

a:link {
font-family: Geneva, Arial, Helvetica, sans-serif;}

#menu {
width: 606px;
background: #000000;
float: left;
font-family: Geneva, Arial, Helvetica, sans-serif;
}

#menu ul {
list-style: none;
margin: 0;
padding: 0;
width: 100px;
float: left;
height:100px;
background-color:#000000;
}

#menu a, #menu h2 {
font-size: 10px;
font-family: Geneva, Arial, Helvetica, sans-serif;
display: block;
margin: 0;
width: 100px;
}

#menu h2 {
color: #FFFFFF;
background: #000000;
text-transform: uppercase;
width: 100px;
height: 100px;
}

#menu a {
color: #FFFFFF;
background: #000000;
text-decoration: none;
}

#menu a:hover {
color: #FFFFFF;
background: #1a1a1a;
}

#menu li {position: relative; width: 100px;}

#menu ul ul {
position: absolute;
z-index: 500;
}

#menu ul ul ul {
position: absolute;
top: 0;
left: 100%;
}

div#menu ul ul,
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
{display: none;}

div#menu ul li:hover ul,
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}

[URL=“http://www.olssongerthel.se/site/index.html”]

    and the css can be found also on
     [http://www.olssongerthel.se/site/menu.css](http://www.olssongerthel.se/site/menu.css)
     and
     [http://www.olssongerthel.se/site/css2.css](http://www.olssongerthel.se/site/css2.css)
    I'm trying to vertically align all the menu items (Start, butik etc.) to the middle of the 100x100 box but I can't seem to make it work. Does anyone know what the problem is?