Propiedad column-span

La propiedad column-span establece el número de columnas que debe abarcar un elemento en un diseño de texto multicolumna. La propiedad acepta como valor un número 1, o la palabra clave all. Con el valor 1 el elemento abarcará una columna, y con el valor all, todas las columnas.

Sintaxis

cssselector {
  column-span: 1 | all;
}

Valor por defecto: 1.

Ejemplo

En este ejemplo, el encabezado se ubicará dentro de la primera columna:

html<div id="elem">
  <h2>Lorem ipsum dolor sit amet eu metus non</h2>
  some long text
</div>
css#elem h2 {
  column-span: 1;
  margin: 0;
}
#elem {
  column-count: 3;
  text-align: justify;
}

Результат:

Ejemplo

Y ahora el encabezado abarcará todas las columnas:

html<div id="elem">
  <h2>Lorem ipsum dolor sit amet eu metus non</h2>
  some long text
</div>
css#elem h2 {
  column-span: all;
  margin: 0;
}
#elem {
  column-count: 3;
  text-align: justify;
}

Результат:

Véase también

  • propiedad column-count,
    que establece el número de columnas
  • propiedad column-width,
    que establece el ancho de la columna
  • propiedad column-gap,
    que establece el espacio entre columnas
  • propiedad column-rule,
    que establece la regla entre columnas
  • propiedad columns,
    que es una propiedad abreviada para el diseño multicolumna