Flujo de elementos, display y position

 

lenguaje de marcas 26-01-2021 (modalidad presencial y online)

En la clase de Lenguaje de Marcas impartida el día 26-01-2021, tocamos el tema del flujo de los elementos en la ventana del navegador, para inspeccionar y ver el codigo y demas opciones.

Tambien vimos el tipo de cajas que tenia el display. Investigando he encontrado las caracteristicas de los dos tipos de cajas que hay:

Cajas en bloque:

• La caja fuerza un salto de línea al llegar al final de la línea.
• La caja se extenderá en la dirección de la línea para llenar todo el espacio disponible que haya en su contenedor. En la mayoría de los casos, esto significa que la caja será tan ancha como su contenedor, y llenará el 100% del espacio disponible.
• Se respetan las propiedades width y height.
• El relleno, el margen y el borde mantienen a los otros elementos alejados de la caja.
• La caja no fuerza ningún salto de línea al llegar al final de la línea.
• Las propiedades width y height no se aplican.
• Se aplican relleno, margen y bordes verticales, pero no mantienen alejadas otras cajas en línea.
• Se aplican relleno, margen y bordes horizontales, y mantienen alejadas otras cajas en línea

Tambien vimos la propiedad position de CSS que especifica cómo un elemento es posicionado en el documento. Las propiedades top, right, bottom, y left determinan la ubicación final de los elementos posicionados.