Comunidad de diseño web y desarrollo en internet online

Encolumnado tipo diario o revista

Citar            
MensajeEscrito el 22 Ago 2006 06:43 pm
buenas tardes gente de cristallab.
una pregunta sencilla y rapidia.
¿ existe alguna forma de encolumnar un parrafo usando CSS . para que quede como en los diarios?

ej : tengo un parafo en un a capa con ancho y alto fijo (400 x 400px) y quiero que cuando llege al final ( cuando alcanse el alto ) es texto que escriba pase a la columna siguiente.

Por ahora lo resolvi usando php y contando caracteres. pero queda un codigo demaciado complicado de mantener

si algien conoce otra forma (aparte de css) espero sugerancias

Por dugalman

7 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 23 Ago 2006 04:04 am
Solo es una idea para que la sigas y la mejore a tu gusto

Código :

.columns{
   height:400px;
   border:solid 1px #CCCCCC;
   color:#666666;
   overflow:auto;
}
.columns p{
   margin-left:10px;
   width:150px;
   float:left;
}


xhtml

Código :

<div class="columns">
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam a tortor. Nulla adipiscing mi non ipsum. Cras rhoncus dui vitae tortor. Curabitur turpis purus, ornare eget, suscipit eget, placerat nec, mi. Sed arcu nisi, hendrerit vel, consectetuer eget, sodales in, tellus. Nam eros dolor, viverra ac, ultricies in, faucibus eget, dui. Duis id neque laoreet dolor egestas ultricies. Donec sit amet augue ultricies ligula posuere aliquam. Aliquam accumsan arcu nec est. Nulla rhoncus nisl at erat.
</p>
<p>
Aliquam consectetuer neque ut lacus fringilla varius. Integer tempor pulvinar mi. Sed quam nunc, vulputate id, posuere sed, vehicula tempus, neque. Vivamus orci lacus, sodales et, porta in, convallis at, lectus. Vestibulum ac purus at pede mollis malesuada. Sed magna tellus, rhoncus in, tincidunt vel, dapibus eu, risus. Nam ultricies. Curabitur id tellus non urna varius consectetuer. Sed tempor sodales diam. Proin ipsum diam, pellentesque vel, mattis vel, feugiat at, urna. Vestibulum tincidunt lacus vitae velit euismod consectetuer. Vivamus eu orci et nisi adipiscing dapibus. Donec porta. Phasellus augue quam, ullamcorper quis, tincidunt sit amet, rhoncus quis, tortor. Sed nec mauris vitae pede tempus posuere. Morbi id lorem. Etiam quam. Donec pretium ligula eu nisl. Aliquam erat volutpat.
</p>
<p>

Morbi sit amet sem. Quisque eu est non felis commodo tristique. Aliquam erat volutpat. Etiam eleifend, ipsum id iaculis aliquam, neque turpis lobortis est, et vulputate sem augue quis diam. Fusce sit amet elit pulvinar magna iaculis tristique. Aliquam eleifend massa eu nulla. Donec sodales adipiscing tellus. Aliquam tincidunt, sem non adipiscing varius, neque quam facilisis mauris, elementum rutrum tortor erat vel nibh. Etiam tincidunt. Proin blandit. Nulla pede. Nunc gravida, lectus eu dignissim faucibus, lorem risus venenatis lectus, at luctus enim lorem eu massa. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
</p>
<p>
Donec libero. Ut pellentesque volutpat ligula. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean sit amet quam. Etiam sodales pharetra velit. Nulla congue, dolor ac elementum dapibus, velit leo ultrices tortor, eget fermentum risus nulla nec arcu. Nam suscipit augue quis urna. Quisque tellus orci, luctus at, consequat id, tempus quis, tellus. Cras sodales, justo ac malesuada consectetuer, tellus nulla malesuada nisi, vel venenatis sapien pede id purus. In eu lectus. Nullam imperdiet ante ac ipsum. Duis ultricies orci sit amet odio. Quisque velit ipsum, ullamcorper non, nonummy ac, rhoncus eu, nisi. Fusce egestas mauris feugiat diam. Sed convallis tincidunt sem. Etiam velit metus, gravida at, pretium ac, elementum vel, neque. Quisque neque ligula, ultrices ac, adipiscing ac, convallis quis, ipsum. Suspendisse erat. Sed eu massa.
</p>
<p>
Integer tortor odio, aliquam quis, ultrices sit amet, feugiat eget, nibh. Vestibulum lectus. Nullam sit amet metus. Praesent nisl. Etiam tellus est, accumsan ac, consectetuer sit amet, consequat in, purus. Aenean ut massa non libero pretium porta. Suspendisse pharetra velit vitae risus. Integer sapien augue, egestas quis, faucibus vel, mattis ut, dui. Morbi vel neque. Maecenas non orci eget justo convallis venenatis. Aliquam erat volutpat. In felis diam, accumsan at, interdum non, tempus id, turpis. Nam lacinia imperdiet augue. Donec fringilla nunc id pede. Pellentesque id ipsum.
</p>
</div>




saludos

Por Maikel

BOFH

5575 de clabLevel

22 tutoriales
5 articulos

Genero:Masculino   Team Cristalab

Claber de baja indefinida

firefox
Citar            
MensajeEscrito el 23 Ago 2006 02:25 pm
Existe una propiedad en CSS que te permite dividir el contenido en columnas al estilo "periódico" o "diario". Pero esta propiedad es muy reciente, aún es parte de la fase de desarrollo del CSS3, en otras palabras aún no está implementada y no se puede usar.

Mientras tanto puedes poner el contenido dentro de ciertos divs y luego darles tamaños y flotarlos. Saludos.

Por NEO_JP

BOFH

5724 de clabLevel

13 tutoriales
12 articulos

Genero:Masculino   Anime Bloggers Premio_Secretos Team Cristalab

Front-end Developer en Washington, DC

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.