1. Propiedades
1.1. Static
1.1.1. Los elementos aparecen uno seguido de otro, de forma vertical, hacia abajo de la página.
1.2. Relative
1.2.1. Los elementos se mueven en cualquier dirección pero no afectan la posición de los elementos que los rodean pero dejan un espacio.
1.3. Absolute
1.3.1. Los elementos se posicionan en relación con su contenedor, pero no afectan la posición de los elementos que los rodean, el resto de los elementos lo ignoran, como si no existieran.
1.3.1.1. h1{ position: absolute; }
1.3.2. Z-index
1.3.2.1. Al aplicar la propiedad z-index asignamos el nivel o capa en la que se colocará el elemento posicionado con la propiedad position: absolute
1.3.2.1.1. h1{ position: absolute; z-index: 2;}
1.4. Fija
1.4.1. Los elementos se posicionan en relación con su contenedor, no afectan la posición de los elementos que los rodean y no se mueven al usar el scroll del navegador.
1.5. Float
1.5.1. Los elementos aparecen uno a lado de otro, ya sea a la izquierda o a la derecha y el resto de los elementos fluyen a su alrededor.
1.5.2. Static
1.5.2.1. Posiciona los elementos de forma vertical
1.5.3. Left
1.5.3.1. Coloca los elementos uno a lado de otro, a modo de columnas.
2. Flexbox (caja flexible)
2.1. Conceptos y terminología
2.1.1. Flex container
2.1.1.1. El elemento "padre" que contiene los elementos flexibles
2.1.1.2. Propiedades
2.1.1.2.1. 1. Display
2.1.1.2.2. 2. Flex-direction
2.1.1.2.3. 3. flex-warp
2.1.1.2.4. 4. Flex-flow
2.1.1.2.5. 5. Justify-content
2.1.1.2.6. 6. Align-items
2.1.1.2.7. Align-self
2.1.2. Flex item
2.1.2.1. Cada hijo de un contenedor flex se convierte en un elemento flexible
2.1.2.2. Propiedades
2.1.2.2.1. Order
2.1.2.2.2. flex-grow
2.1.2.2.3. flex-basis
2.1.2.2.4. flex
2.1.3. Main start
2.1.3.1. Eje a lo largo del cual los elementos flexibles se suceden unos a otros
2.1.4. Main axis
2.1.4.1. Eje perpendicular al eje principal.