Quasi tutti i quotidiani online adottano nei loro siti, più precisamente all'interno degli articoli stessi la suddivisione del testo in più colonne per riportare a fianco una notizia passata, per una migliore gestione di un banner pubblicitario o semplicemente per la tematica del sito che necessita di scrivere ogni post su due colonne come per esempio i siti di traduzione dei testi delle canzoni che sulla sinistra inseriscono il testo originale in lingua straniera e sulla destra il testo tradotto in italiano. Con questo metodo si riesce ad utilizzare anche la parte di spazio vuoto inutilizzata di Blogger quando si è crea ad esempio un lungo elenco di link o immagini, stessa cosa vale per gli elenchi realizzati con Wordpress dato che questa procedura potrà essere applicata in qualunque piattaforma ed in qualsiasi tipologia di sito.
Per adoperare anche voi questo metodo create un post come avete sempre fatto, poi andate nella modalità HTML del post ed inserite i codici qui sotto se volete dividere i posti di Blogger in 2, 3 o 4 colonne.
Dovete sostituire le frasi TESTO PRIMA, SECONDA, TERZA, QUARTA COLONNA con quello che volete. Mentre le percentuali e le dimensioni del width servono per ridimensionare le colonne a proprio piacimento. Vi consiglio di lasciarle così per come sono, ma se si presentano difetti grafici dopo la pubblicazione allora è vostro dovere modificarli in base alle vostre esigenze.
Per adoperare anche voi questo metodo create un post come avete sempre fatto, poi andate nella modalità HTML del post ed inserite i codici qui sotto se volete dividere i posti di Blogger in 2, 3 o 4 colonne.
Dovete sostituire le frasi TESTO PRIMA, SECONDA, TERZA, QUARTA COLONNA con quello che volete. Mentre le percentuali e le dimensioni del width servono per ridimensionare le colonne a proprio piacimento. Vi consiglio di lasciarle così per come sono, ma se si presentano difetti grafici dopo la pubblicazione allora è vostro dovere modificarli in base alle vostre esigenze.
Suddivisione del Testo in 2 Colonne
<div style="float: left; text-align: justify; width: 47%;">
TESTO PRIMA COLONNA</div>
<div style="float: right; text-align: justify; width: 47%;">
TESTO SECONDA COLONNA</div>
<div style="clear: both;">
</div>
Suddivisione del Testo in 3 Colonne
<style type="text/css">
#col1 {
width: 260px;
float: left;
text-align:justify;
}
#col2 {
width: 600px;
float: right;
text-align:justify;
margin: 0;
padding: 0;
}
</style>
<div id="col1">
TESTO PRIMA COLONNA</div>
<div id="col2">
<div style="float: left; width: 47%;">
TESTO SECONDA COLONNA</div>
<div style="float: right; width: 47%;">
TESTO TERZA COLONNA</div>
<div style="clear: both;">
</div>
</div>
Suddivisione del Testo in 4 Colonne
<style type="text/css">
#col11 {
width: 430px;
float: left;
text-align:justify;
}
#col21 {
width: 430px;
float: right;
text-align:justify;
margin: 0;
padding: 0;
}
</style>
<div id="col11">
<div style="float: left; width: 47%;">
TESTO PRIMA COLONNA</div>
<div style="float: right; width: 47%;">
TESTO SECONDA COLONNA</div>
<div style="clear: both;">
</div>
</div>
<div id="col21">
<div style="float: left; width: 47%;">
TESTO TERZA COLONNA</div>
<div style="float: right; width: 47%;">
TESTO QUARTA COLONNA</div>
<div style="clear: both;">
</div>
</div>
