El estilo de un menú desplegable (Y el efecto hover)

Tengo un pequeño problema. Estoy tratando de conseguir una imagen activable en un menú a ser dinámica. Lo que quiero decir con esto es que el borde izquierdo y el borde derecho sería una "sombra", mientras que el resto sería un color (1) sólido. El problema aquí, sin embargo, es que el texto sería de diferente tamaño, por lo que la imagen tiene que ser dinámica.



Alguien tiene alguna idea de cómo puedo lograr eso? Preferiblemente una solución CSS (tuve uno antes, pero lo perdí [El menú desplegable]).

¿Alguna idea sobre cómo puedo hacer que se ciernen a ser de tamaño dinámico? Gracias.

Mi Progreso actual

[Editar] ¿Qué tengo que ahora se ve perfecto en Firefox...se ve un poco diferente en IE (La sombra derecho a suspender)

Muy bien, tengo los enlaces dinámicos más o menos cubiertos...theres todavía un error en él sin embargo...MSIE estropea el lado derecho de la sitúe un poco. El fondo amarillo cubre la mitad de la sombra.

Ahora lo que Im que falta es el menú desplegable...

Estoy realmente cayendo de bruces en este caso. Tengo el ejemplo Stu Nicholls, pero me parece que no puede estilo correctamente

Por favor, necesito ayuda aquí.

¿Dónde está el error pasa? En MSIE6?
Se ve bien en IE7 e IE8 tan mal se supone que tienen el mismo problema con IE6.

Esto se debe a que IE6 sólo entiende el ": hover" pseudo-clase cuando se aplica a un "<a>". En su hoja de estilo que se está aplicando a una "<li>" etiquetas.

Estoy teniendo este error en IE7. La sombra en el lado derecho está cubierto un poco por el "oro" de fondo. Compruebe la diferencia entre Firefox e IE7...La sombra de la derecha es más pequeña en IE7

Hmmm, no seguro de lo que estamos hablando. Parecen ser idénticos entre los navegadores en mi equipo. ¿Le importaría publicar una captura de pantalla? Yo podría estar buscando en el área equivocada.