enrique-j
11/20/2017 - 4:25 PM

el navegador se encargue de producir texto multicolumna, es decir, que maquete directamente el texto en varias columnas sin tener que hacer

el navegador se encargue de producir texto multicolumna, es decir, que maquete directamente el texto en varias columnas sin tener que hacer nosotros nada.

Textos multi-columna.md
content_copyfile_download
  • Rendered
  • Source

Atributos

colum-width: servirá para definir la anchura de las distintas columnas a crear.

column-gap: nos permitirá definir el espacio en blanco entre columnas.

column-rule: servirá para crear un filete o línea divisoria entre las columnas.

Estas etiquetas por el momento no las soporta tal cual ningún navegador. Sin embargo Safari, Google Chrome y Firefox ya implementan el multicolumna, de manera experimental y hasta que las especificaciones de CSS 3 estén dispuestas para incorporar en los navegadores.

Multicolumna en diferente navegadores

.multicolumna{ -moz-column-width: 15em; -moz-column-gap: 15px; -webkit-column-width: 15em; -webkit-column-gap: 15px; -webkit-column-rule: 1px solid #ccc; -moz-column-rule: 1px solid #ccc; }

column-count

Otra posibilidad para crear un multicolumna será definir simplemente el número de columnas que querríamos incorporar en el texto, por medio del atributo column-count, de esta manera:

.multicolumna5columnas{ -moz-column-count: 5; -moz-column-gap: 2em; -moz-column-rule: 1px solid #ccf; -webkit-column-count: 5; -webkit-column-gap: 2em; -webkit-column-rule: 1px solid #ccf; }