Mostrar texto en columnas con CSS3
En este artículo vamos a ver como mostrar texto en columnas al estilo revista o periódico con CSS3.
Como vemos en la imagen anterior mostramos un texto en 3 columnas. Para conseguir este efecto hemos creado una clase empleando CSS3.
.newspaper {
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
column-count:3;
-moz-column-gap:40px; /* Firefox */
-webkit-column-gap:40px; /* Safari and Chrome */
column-gap:40px;
width:600px;
}
Y en el <body> añadiremos el siguiente código HTML:
<div class="newspaper"> <!-- Tu texto --> </div>
El único inconveniente es que no funciona en Internet Explorer.
Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
¿Buscas trabajo de programador?
73 artículos que te podrían interesar
Ver más sobre
Deja una respuesta