Buenas tardes.
Estoy montando una lista desplegable dropdown con javascript en un menú horizontal normal y corriente.
La ul que contiene el listado desplegable debe tener un fondo especial con bordes redondeados que no se puede lograr con css, así que he articulado un :after y un :before que contiene la tapa superior e inferior del fondo. Después un elemento longitudinal de un pixel que se repite horizontalmente.
El efecto se consigue, pero el problema es que el espacio con el background superior se carga con un intervalo de un segundo de retraso con respecto al resto, lo cual es bastante antiestético y no muy presentable.
Es decir, baja la ul con los ítems de menú con el fondo general y la tapa inferior en el :after y luego, como aparte sube un espacio antes del primer elemento de la lista y aparece el fondo que hace de tapa superior.
Por mucho que he colocado el css correspondiente en primer puesto no se consigue nada. Tampoco es cuestión de sprite ni de la imagen de fondo en sí, que no llega a 1 kb de peso, sino que el pseudoelemento :before se carga después de lo demás.
¿Se os ocurre cómo arreglarlo para evitar este desfase?
Gracias.
