Contexto de formato de bloque

Un contexto de formato de bloque es parte del renderizado CSS visual de una página web. Es la región en que ocurre la disposición de las cajas de bloque y en la cuál los elementos flotantes interactúan los unos con los otros.

Un contexto de formato de bloque es creado por uno de los siguientes casos:

• El elemento raiz o algo que lo contiene
• flotantes (elementos donde float es diferente de none)
• elementos con posición absoluta (elementos donde position es absolute o fixed)
• bloques en línea (elementos con display: inline-block)
• Celdas de tabla (elementos con display: table-cell, que es la propiedad por defecto de las celdas de una tabla HTML)
• subtítulos de tabla (elementos con display: table-caption, que es la propiedad por defecto de los subtítulos de tablas HTML)
• elementos donde overflow tiene un valor distinto a visible
• cajas flexibles (elementos con display: flex or inline-flex)

Un contexto de formato de bloque contiene todo dentro del elemento que lo crea que, al mismo tiempo, no se encuentra dentro de un elemento descendiente que crea un nuevo contexto de formato de bloque.

Los contextos de formato de bloque son importantes para el posicionamiento (revisa float y clear) de flotantes. Las reglas para el posicionamiento y limpiado de flotantes aplican solo a elementos dentro del mismo contexto de formato de bloque. Los flotantes no afectan la disposición de los elementos en otros contexto de formato de bloque, y clear solo limpia flotantes pasados en el mismo contexto de formato de bloque.

• CSS 2.1

• float, clear