CSS Grid
Layout con Tablas
Layout con Floats
COPYRIGHT © 2017 LAURA CHUBURU
Patrón relative/absolute
COPYRIGHT @bpapillard
Flexbox
COPYRIGHT thatemil.com
Soporte actual (2018) CSS-Grid
https://caniuse.com/#feat=css-grid
| 01 | 02 | 03 | 04 |
|---|---|---|---|
|
05 |
06 |
07 |
08 |
|
09 |
10 |
11 |
12 |
Contenedor Grid
| 01 | 02 | 03 | 04 |
|---|---|---|---|
| 05 | 06 | 07 | 08 |
| 09 | 10 | 11 | 12 |
display: grid
.grid-container {
}
grid-template-columns: 100px 150px 50px 100px
Declaración explícita de columnas
Posicionamiento
implícito de filas
| 01 |
02 | 03 | 04 |
|---|---|---|---|
|
05 |
06 | 07 | 08 |
| 09 | 10 | 11 | 12 |
Declaración explícita de columnas
display: grid
.grid-container {
}
grid-template-columns: 100px 150px 50px 100px
Declaración
explícita de filas
grid-template-rows: 100px 150px
Posicionamiento
implícito de filas
}
CSS Grid
By David Garcia
CSS Grid
Slides presentadas en el canal de YouTube: Aprendiendo Frontend
