CSS - Hacer que un div consuma todo el espacio disponible

Todos

Tengo una página que se supone ocupará solo el espacio de pantalla disponible en el navegador.

Tengo una 'barra superior' y una 'barra inferior', ambas fijadas en la parte superior e inferior de la página. Quiero tener un div que consumirá (ocupará) el resto del espacio entre las dos barras mencionadas anteriormente.

Es crucial que el div del medio no se superponga con las barras superior e inferior. ¿Es esto posible con CSS o necesito hacer uso de js.

Además, si voy con js, considerando que el navegador carga el CSS primero antes del código js, ¿cómo funciona lo anterior usando js para el posicionamiento central?

Muchas gracias

Respuestas a la pregunta(3)

Su respuesta a la pregunta