Joomla.it Forum

Joomla! 3 => Joomla! 3 => : Thommy 11 Aug 2016, 14:35:14

: Griglia Bootstrap Responsive
: Thommy 11 Aug 2016, 14:35:14

Ciao Ragazzi,
stò inserendo una griglia in un articolo ma ho dei problemi con il ridimensionamento. Quello che vorrei fare è una griglia a 4 colonne per dimensioni schermo sopra i 768px, mentre per i cellulari al di sotto dei 768px vorrei 2 colonne e non una unica come mi viene attualmente.

Il codice utilizzato al momento è:

<div class="row-fluid">
<div class="span3"><img src="images/Atleti_Master_icon_02_small.png" alt="Atleti Master icon 02 small" />
XXXXXX</div>
<div class="span3"><img src="images/Atleti_Master_icon_02_small.png" alt="Atleti Master icon 02 small" />
XXXXXX</div>
<div class="span3"><img src="images/Atleti_Master_icon_02_small.png" alt="Atleti Master icon 02 small" />
XXXXXX</div>
<div class="span3"><img src="images/Atleti_Master_icon_02_small.png" alt="Atleti Master icon 02 small" />
XXXXXX</div>
</div>

Ho provato anche con questo codice, ma mi viene un'unica colonna su qualunque dimensione di schermo:

<div class="row-fluid">
<div class="col-xs-6 col-sm-3"><img src="images/Atleti_Master_icon_02_small.png" alt="Atleti Master icon 02 small" />
XXXXXX</div>
<div class="col-xs-6 col-sm-3"><img src="images/Atleti_Master_icon_02_small.png" alt="Atleti Master icon 02 small" />
XXXXXX</div>
<div class="col-xs-6 col-sm-3"><img src="images/Atleti_Master_icon_02_small.png" alt="Atleti Master icon 02 small" />
XXXXXX</div>
<div class="col-xs-6 col-sm-3"><img src="images/Atleti_Master_icon_02_small.png" alt="Atleti Master icon 02 small" />
XXXXXX</div>
</div>

Non capisco perchè quest'ultima non mi fa visualizzare il layout corretto...

Grazie mille

: Re:Griglia Bootstrap Responsive
: giusebos 11 Aug 2016, 16:42:47

questo codice è per la versione 2 di bootstrap

:

<div class="span3">
mentre questo è per la 3, ma è scritto male

:

<div class="col-xs-6 col-sm-3">

: Re:Griglia Bootstrap Responsive
: Thommy 11 Aug 2016, 16:48:00

: giusebos  11 Aug 2016, 16:42:47

questo codice è per la versione 2 di bootstrap

:

<div class="span3">
mentre questo è per la 3, ma è scritto male

:

<div class="col-xs-6 col-sm-3">

Dove ho sbagliato? Ho letto più volte le indicazioni su Getbootstrap, ti allego screenshot:

: Re:Griglia Bootstrap Responsive
: giusebos 11 Aug 2016, 16:49:36

la prima domanda che devi porti è "quale versione di bootstrap sta utilizzando il mio template?"

: Re:Griglia Bootstrap Responsive
: Thommy 11 Aug 2016, 17:02:30

...e hai ragione anche tu... Trovassi il file css te lo direi anche...

: Re:Griglia Bootstrap Responsive
: giusebos 11 Aug 2016, 17:15:17

dove lo cerchi il file?
I file css del template sono dentro la cartella del template

: Re:Griglia Bootstrap Responsive
: Thommy 11 Aug 2016, 17:20:00

: giusebos  11 Aug 2016, 17:15:17

dove lo cerchi il file?
I file css del template sono dentro la cartella del template

Si, ma con questo template i file css hanno un nome tutto loro...

: Re:Griglia Bootstrap Responsive
: giusebos 11 Aug 2016, 17:41:13

 ??? ???

: Re:Griglia Bootstrap Responsive
: Thommy 11 Aug 2016, 21:07:29

Quindi , il foglio di stile bootstrap in questo template non esiste, il codice che serve è implementato negli altri fogli di stile, quale in particolare non si sa... La versione è comunque la 2, ho guardato la definizione delle classi della 2 e la 3 e quelli utilizzati nel mio sono quelli della 2. Direi quindi che con la vecchia versione non è possibile utilizzare 2 colonne nello smartphone come volevo... :(


Grazie per l'attenzione, ciao!