La estructura div es -

 <div class="parent"> <div class="left float-start"></div> <div class="right float-end overflow-y"></div> <div>

Ahora,

1. Para el hijo izquierdo -

   • la altura debe basarse en el contenido dinámico
   • se muestra completamente sin desplazamiento de desbordamiento

2. Para el niño correcto -

   • la altura también se basa en el contenido dinámico, pero
   • la altura máxima debe ser la altura del niño izquierdo
   • configurado para overflow-y scroll, por lo que nunca es más largo que el hijo izquierdo, pero puede ser más corto

¿Cómo hago esto solo usando css?

¡¡Cualquier ayuda sería apreciada!!