Estilos CSS - Diseño Web responsivo - Uso de Flex

Los scripts de estos ejemplos se encuentran en el Capítulo 10 del Libro 1 del Instructivo JavaScript y Más

Este Libro 1 está a la venta en Amazon

Mi Sitio Web de dos columnas

Explora cómo usar selectores y propiedades para diseñar sitios web de varias columnas y mucho más. ¡Mejora tus habilidades en desarrollo web. ¡Inicia tu viaje hacia el dominio del desarrollo web hoy mismo!

Los scripts de estos ejemplos se encuentran en el Capítulo 9 del Libro 1 del Instructivo Programando Paso a Paso y Más

Los libros están a la venta en Amazon

En este ejemplo utilizamos flex en el contenedor .container para crear una disposición de dos columnas.
flex: 1 en main y aside asegura que ambos elementos se expandan proporcionalmente.
min-width en main y aside asegura que mantengan un ancho mínimo adecuado.
El @media query cambia el diseño a una sola columna en dispositivos con un ancho máximo de 768px.
Esta division final abarca las dos columnas y se coloca en posición vertical en pantallas pequeñas