Gracias por la ayuda pero al final logré resolverlo gracias a la pseudo-clase first-child, de manera que al primer elemento de cada submenú le pongo de fondo la imagen que remata la parte superior con las esquinas redondeadas. De esta manera tengo un submenú con una imagen de fondo que se adapta en altura a las opciones que haya. La imagen que permite la altura variable queda definida tal y como la había hecho en principio:
Código:
.artmenu > li:hover ul {
background-position: bottom left;
background-repeat: no-repeat;
background-image: url('../images/ddbg.png');
padding: 0 0 10px 0; /*los 10px son el hueco para el remate superior*/
margin: 0 0 0 0;
z-index: 5000;
display: inline;
}
Y el remate de la parte superior queda definido como sigue:
Código:
.artmenu ul li:first-child {
background-image: url('../images/submenubg_top.png');
background-repeat: no-repeat;
background-position: top left;
margin: -10px 0 0 0; /*los 10px son la altura de la imagen*/
padding-top: 10px; /*los 10px son la altura de la imagen*/
}
Gracias y un saludo