CSS: haga que el submenú desplegable aparezca debajo del padre

Estoy tratando de crear un menú desplegable de CSS. El problema es que todos los nodos secundarios en el árbol ulli aparecen en la misma fila, en lugar de debajo del padre. ¿Cómo hago que las subcategorías aparezcan A CONTINUACIÓN de los padres?

Agregar display:block; float: left;position: relative; display:block; float: left;position: relative; en el li para establecer un bloque contenedor y luego position:absolute; top:100%; left:0; position:absolute; top:100%; left:0; en el submenú ul para posicionarlo con respecto a su bloque contenedor.

Puede usar css para colocar el submenú.

 ul li { position: relative; } ul li ul.sub { position: absolute; left: 0; top: 100%; } 

Los elementos del menú principal deben tener un contexto de posicionamiento, probablemente relativo. Luego, para el menú secundario, establezca el posicionamiento en absoluto, ajústelo a la izquierda en 0 y arriba al 100%. Eso debería hacer el truco.