Joomla.it Forum

Joomla! 3 => I Template di Joomla! 3 => : wuzetian 27 Dec 2015, 15:18:37

: template protostar - categoria blog - 2 colonne di differente larghezza
: wuzetian 27 Dec 2015, 15:18:37
Salve a tutti,
utilizzo il template protostar di joomla 3 e vorrei che una pagina fosse divisa tra due colonne di diversa larghezza (ad esempio la prima 66% e la seconda 34%).
Ho creato la classe "colsa" e la ho assegnata alla pagina

.colsa .cols-2 .column-1 {
   background: #cc0000;
  width: 66%;
 }
.colsa .cols-2 .column-2 {
    background: #cc00cc;
  width: 34%;
}
Il risultato ottenuto è che il contenitore della pagina è sempre diviso in due colonne uguali (class span6) e che l'articolo della prima colonna occupa il 66% lasciando vuoto il restante spazio ed il secondo articolo occupa il 34% lasciando vuoto il restante spazio.
Vorrei che il primo articolo occupasse il 100% dello spazio assegnato alla prima colonna (66%) e che il secondo articolo occupasse il 100% dello spazio assegnato alla seconda colonna (34%).
Qualcuno riesce gentilmente ad aiutarmi ed a chiarirmi le idee?
Grazie mille
 :)
: Re:template protostar - categoria blog - 2 colonne di differente larghezza
: adottauncane 27 Dec 2015, 15:32:38
Ciao wuzetian,
potrebbe essere che hai del padding o del margin e quindi devi tenerne conto nel suddividere le due colonne. Se metti un link al sito sarà più facile aiutarti.
: Re:template protostar - categoria blog - 2 colonne di differente larghezza
: wuzetian 27 Dec 2015, 15:39:39
Sì certo.
: Re:template protostar - categoria blog - 2 colonne di differente larghezza
: adottauncane 27 Dec 2015, 16:13:07
Emmm, mi sa che non si possa, .span6 è assegnato alle due colonne, ed è al 48%. Facendo un css che le riduce, questa misura diventa il 60% di 48% e il 30% sempre di 48%.
Non credo che con il solo css si riesca. Dovresti intervenire sul .php probabilmente.
: Re:template protostar - categoria blog - 2 colonne di differente larghezza
: adottauncane 27 Dec 2015, 16:26:09
L'unica che mi viene, ma devi poi verificare è sostituire al tuo css su costum.css questo:

:
.colsa .items-row.cols-2 .item.column-1  {
 
  background: #cc0000;
  width:130%
 
}

.colsa .items-row.cols-2 .item.column-2 {
 
  background: #cc00cc;
  width:70%;
  float:right;
 
}
: Re:template protostar - categoria blog - 2 colonne di differente larghezza
: adottauncane 27 Dec 2015, 16:28:55
Nel caso devi poi scrivere il css per quando si riduce lo schermo e per i dispositivi.
: Re:template protostar - categoria blog - 2 colonne di differente larghezza
: wuzetian 27 Dec 2015, 16:59:10
Ok
Grazie mille.
Adesso provo sul php oppure scriverò il css per i mobili.
Grazie ancora
 :)