CSS Grid vs Flexbox
Ir a la navegación
Ir a la búsqueda
Introdución
Os elementos flotantes e o posicionamiento foron durante moito timpo as únicas ferramientas fiables para crear deseños CSS cuhna alta compatibilidade entre navegadores. Cumplen o seu propósito, pero teñen unha funcionalidade limitada coa que resulta difícil obter un deseño de páxina sinxelo e flexible que cumpla con unos requisitos coma os seguintes:
- Centrar verticalmente un bloque de contedo dentro do seu elemento pai.
- Facer que todos os elementos secundarios dun contenedor ocupen unha cantidade igual do ancho/alto disponible, independentemente do ancho/alto que haiba disponible.
- Facer que todos os elementos nuhna distribución de columnas múltiples adopten a mesma altura incluso se conteñen cantidades diferentes de contido.
Desde 2016 podemos usar os novos valores flex e inline-flex en substitución de block ou inline-block para crear deseños flexibles. Os elementos flexbox facilitan moito as tarefas de distribución de elementos dentro da páxina.
Algunhas das súas ventaxas son:
- Xestión da alineación das caixas
- Centrado horizontal e vertical
- Altos de caixa similares
- Fondos de coles uniformes
También dispoñemos de display:grid para colocar os elementos usando unha rejilla.