Lo que caracteriza un diseño flexible es su habilidad para alterar el ancho y alto de sus elementos para ajustarse lo mejor posible al espacio disponible en cualquier dispositivo. Un contenedor flexible expande sus elementos para rellenar el espacio libre, o los comprime para evitar que rebasen el área prevista.

El algoritmo del modelo de diseño de “cajas flexibles” no parte de niguna dirección predeterminada, al contrario de lo que ocurre con el modelo “bloque”, que asume una disposición vertical de los elementos, o lo que pasa con el modelo “en línea”, que asume una disposición horizontal. Mientras que el modelo “bloque” funciona bien para páginas, se queda muy corto cuando se trata de aplicaciones en las que hay que tener en cuenta el cambio de orientación del dispositivo o los cambios de tamaño realizados por los gestos del usuario. El modelo de “cajas flexibles” es más apropiado para diseños de pequeña escala, mientras que el (emergente) modelo “rejilla” es adecuado para diseños de gran escala. Ambos son parte del gran esfuerzo que el “CSS Working Group” está realizando para proveer de mayor interoperabilidad a las aplicaciones web con todo tipo de usuarios, distintos modos de escritura, y otras necesidades de flexibilidad.

fuente: https://developer.mozilla.org/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS