Índice

Texto en columnas

Las propiedades que permiten crear bloques de texto con columnas se definen en el módulo CSS Multi-column Layout Module, en estado Candidate Recommendation a 12 de abril de 2011. He aquí la URL: http://www.w3.org/TR/css3-multicol/

Presentar un contenido en varias columnas es otra novedad de las hojas de estilo CSS3.

column-count:

Valor entero que determina el número de columnas en las que se va a visualizar el contenido del elemento.

column-width:

Valor que describe el ancho óptimo de cada columna (opcional).

column-gap:

Valor que determina el espacio o el padding entre dos columnas.

column-rule:

Define un borde entre las columnas.

Las propiedades de este módulo se reconocen en Internet Explorer 11, Edge 13 y Opera Mini 8. En los demás navegadores solo se reconocen parcialmente.

-moz-column-count:

-moz-column-width:

-moz-column-gap:

-moz-column-rule:

-webkit-column-count:

-webkit-column-width:

-webkit-column-gap:

-webkit-column-rule:

Ejemplo

<!DOCTYPE html>  
<html lang="es">  
<head>  
<title>Html5</title>  
<meta charset="UTF-8">  
<style type="text/css">  
#box { width: 420px; height: 240px;  
       text-align: justify;  
       column-count: 2;  
       column-gap: 2em;  
       column-rule: 1px solid silver;  
       ...