Hola, Pedrojo.
Hacer lo que quieres para firefox no es ningún problema, porque marcando el div contendor con display: table y los que están dentro con display: table-cell y vertical-align: middle funciona sin problema (no con el menú como lo tienes ahora, sino haciéndolo de otra forma), pero para IE es mucho más difícil.
Como según he visto que tienes el menú, no creo que vaya a quedar así, quiero decir, no incluyes enlaces y demás, así que para intentar encontrar una solución exacta para IE creo que sería mejor teniendo ya el menú como lo vas a querer tener, si no, buscar ahora una manera posible si luego vas a añadir otros elementos (vínculos, fondos, imágenes, etc.), podría no servir de nada, porque como te digo es complicadillo.
Un par de detalles para cuando sigas avanzando:
si pones la almohadilla en la clase body (#body) es como si no pusieras nada; body debe ir sin más:
body {
background:#fff;
margin:0;
... etc.
No deberías usar elementos con el mismo id. Un id debe ser para un elemento único, que aparezca llamado una sola vez en general. Para el caso donde lo has usado, deberías usar elemetos class, es decir:
si vas a usar varios div con la clase "TabUnselected", no pongas
#TabUnselected {
float:left;
width:19.8%;
... etc.
y luego <div id="TabUnselected">
sino:
.TabUnselected {
float:left;
width:19.8%;
... etc.
y luego <div class="TabUnselected">
Es mi opinión, y creo que lo más recomendable.
Si lo has hecho así por alguna razón concreta que desconozco discúlpame.
Mikel.