muestre el menú desplegable fuera de su barra lateral principal, y al desplazarse, el menú también se desplaza de acuerdo con su padre,

Aquí está el código a continuación, necesito el div DropMenu después de desplazar la navegación para cambiar su posición (tanto como la navegación de navegación). mantenerse por debajo del elemento (i)

 nav { overflow-y: visible; overflow-x: hidden; max-height: 70vh; } ul { list-style-type: none; min-width: 15vw; padding-left: 0; } 

¿Hay algún cambio grande o pequeño que pueda hacer para lograrlo?

Puedes echar un vistazo a este ejemplo https://www.w3schools.com/howto/howto_js_sticky_header.asp

A continuación puede ver un rápido ejemplo de lo que he hecho con su código.

  class App extends React.Component { constructor(props) { super(props); this.state = { showDropMenu: true }; } render() { return ( 
Some Text Some Text Some Text Some Text Some Text
); } } nav { background-color: blue; position: fixed; top: 0; width: 100%; } ul { list-style-type: none; min-width: 15vw; padding-left: 0; } .content { margin-top: 100px; }