Propiedad column-width
La propiedad column-width establece el ancho
de las columnas en texto multicolumna. Los valores
de la propiedad son cualquier unidad
de tamaño, excepto porcentajes, o la palabra clave
auto (por defecto). Cuando el valor es
auto, el navegador determina automáticamente el ancho
óptimo de las columnas basándose en column-count
y column-gap.
Sintaxis
selector {
column-width: valor;
}
Ejemplo . Ancho especificado
En este ejemplo se especifica el ancho de columna column-width
en 150px, y su número column-count
establecido en auto. Como resultado,
el ancho de las columnas será de 150px, su número
y el espacio entre ellas será determinado automáticamente por el navegador:
<div id="elem">
some long text
</div>
#elem {
column-count: auto;
column-width: 150px;
text-align: justify;
}
:
Ejemplo . Valor auto
En este ejemplo, el texto se dividirá en 3
columnas (porque column-count está
establecido en 3), pero su ancho se calculará
automáticamente:
<div id="elem">
some long text
</div>
#elem {
column-width: auto;
column-count: 3;
text-align: justify;
}
:
Véase también
-
propiedad
column-count,
que establece el número de columnas -
propiedad
column-gap,
que establece el espacio entre columnas -
propiedad
column-rule,
que establece la regla (línea) entre columnas -
propiedad
column-span,
que establece el número de columnas que debe abarcar un elemento -
propiedad
columns,
que es una propiedad abreviada para multicolumna