• G
    User •

    Incolonnare del testo

    Come posso incolonnare del testo in tre colonne stile giornale? Grazie.

    0
  • J
    User Attivo •

    Ciao gerico980, per quel che ne so, la cosa non si puo' far accadere in automatico! Le uniche soluzioni sono riempiendo le colonne a mano con il testo diviso in tante parti quante le colonne, oppure avere un javascript che legge il testo e lo divide in parti uguali e stampa dentro le tre colonne in maniera intelligente. Nessuna delle due cose ho mai provato effetticamente a farla, ma in rete si dovrebbero trovare degli esempi...

    0
  • M
    User Attivo •

    sinceramente so che con i CSS3 ci saranno novità in merito anche alle colonne:

    css.html.it/articoli/leggi/2320/css3-a-piccoli-passi/10/

    Di mio ti direi di dare una larghezza e un float al p in modo che formino 3 colonne all'interno del tuo div...

    0
  • J
    User Attivo •

    Interessante articolo, ti ringrazio per averlo postato. Ho fatto una prova con i paragrafi con larghezza e float ma visto che tendono ad andare a capo sulla destra e vanno sotto solo quando han finito lo spazio a destra, non mi sembra funzionare a meno che non si fanno dei paragrafi di lunghezza uguale e prestabilita per il layout. In compenso ho fatto una prova con i tag di mozilla che gia' supporta le colonne (e gli angoli tondi) ed e' molto carino: antiworld.biz/test-columns.html [visualizzare con firefox]

    0
  • M
    User Attivo •

    bhe scusa ma se tu dai ad un conteiner 600px di larghezza, ad ogni p un flaot con larghezza di 180px e margine sinistro di 20px...dovrebbe incolonnarti tranquillamente il tutto...

    ps. carino si l'esempio...

    0
  • J
    User Attivo •

    Ciao misterwo, sarei veramente curiosa di verlo, riusciresti a fare una paginetta di esempio?

    0
  • M
    User Attivo • 
    <style>
body, html {width:100%; height:100%;}
body {margin:0; padding:0;}
.contenitore {width:600px; margin:0 auto; padding:10px;}
.contenitore p {width:180px; margin:0 20px 20px 0; padding:0; float:left}
</style>

    [HTML]<div class="contenitore">
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque fermentum, felis ut tincidunt blandit, lorem pede fringilla orci, quis auctor lectus elit sit amet nibh. Proin consectetuer orci ac dui. Pellentesque ante lectus, ultricies eu, congue in, cursus laoreet, urna. Mauris erat felis, scelerisque nec, interdum vel, scelerisque sed, augue. Curabitur consequat lacus vitae nunc. Aliquam diam diam, laoreet tristique, congue a, semper non, sapien. Praesent sollicitudin vestibulum libero. Vestibulum sagittis dictum tellus. Quisque molestie risus at turpis suscipit ultrices. Vestibulum vitae lectus sit amet dolor eleifend vestibulum. </p>
    </div>[/HTML]

    prova e fammi sapere

    0
Effettua l'accesso per rispondere