5 colonne con bootstrap 2

F

Fabio90

Utente Attivo
29 Feb 2012
507
0
16
Buonasera a tutti,
Utilizzando questo codice bootstrap2 mi genera
bootstrap1.png
HTML: 
    <div class="span2 offset1"><img></div>
    <div class="span2"><img></div>
    <div class="span2"><img></div>
    <div class="span2"><img></div>
    <div class="span2"><img></div>

Come posso fare per avere 5 colonne che occupano tutto lo spazio come in questo allegato?
immagine2.jpg

Grazie!
 
filomeni

filomeni

Moderatore
Membro dello Staff
MOD
14 Mag 2006
1.054
6
38
53
Roseto degli Abruzzi (TE)
www.sitiweb.cloud
Ciao, prova una soluzione del genere, ovvio il mio è un esempio che devi conformare...
HTML: 
    <html>
        <head>
		<style>
		#livello1{border: 2px solid;position: relative;width: 1025px;height: 115px;left: 10px;top: 15px;background-color: rgb(255, 255, 0);}
		#livello2{border: medium solid;width: 192px;height: 100px;float: left;right: 200px;margin-left: 5px;margin-top: 5px;background-color: #F00;}
		#livello3{border: medium solid;width: 192px;height: 100px;left: 415px;top: 5px;position: absolute;background-color: #0FFF00;}
		#livello4{border: medium solid;position: relative;width: 192px;height: 100px;left: 210px;top: 5px;background-color: #0042FF;}
		#livello5{border: medium solid;position: absolute;width: 192px;height: 100px;left: 620px;top: 5px;background-color: #F900FF;}
		#livello6{border: medium solid;position: absolute;width: 192px;height: 100px;left: 825px;top: 5px;background-color: #0B6B6B;}
		</style>
		</head>
        <body>
            <div id="livello1">
                <div id="livello2">Img1</div>
                <div id="livello3">Img2</div>
                <div id="livello4">Img3</div>
                <div id="livello5">Img4</div>
                <div id="livello6">Img5</div>
            </div>
        </body>
    </html>
 
S

Soulfearor

Utente Attivo
16 Set 2014
54
0
6
Torino
www.serenagraficatorino.it
Non puoi creare 5 colonne che io sappia in quanto bootstrap si basa su un valore 12 e 12 non è divisibile per 5.
Nel tuo esempio c'è:
offset 1 + colonna 2 + colonna 2 + colonna 2 + colonna 2 + colonna 2 + uno spazio di 1 in questo caso, generato in automatico in quanto la somma delle colonne che hai definito fa 11 e non 12 tenendo conto dell'offset.

Prova manualmente es:
HTML
Codice: 
<div id=contenitore">
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
</div>
CSS
Codice: 
#contenitore {
width:1200px;
}

.col {
width:20%;
display:block;
flat:left;
}

Ciau!
 
filomeni

filomeni

Moderatore
Membro dello Staff
MOD
14 Mag 2006
1.054
6
38
53
Roseto degli Abruzzi (TE)
www.sitiweb.cloud
Ciao, Per il discorso di Bootstrap non so risponderti non è cosa che uso. Comunque il mio voleva essere un puro esempio di suddivisione per gli spazi, non testato con il "sistema" suddetto.
Il tuo esempio, anche se ha un paio di errori, è sicuramente più fluido ma comunque errato in quanto usi:
Codice: 
display:block;
e nel caso di Fabio90 bisogna usare:
Codice: 
display:inline;
Credo che la soluzione l'hai data, in questa maniera Fabio90 dovrà gestire solo "width" del contenitore e "width" delle colonne.
Ciao
 
Ultima modifica:
Devi accedere o registrarti per poter rispondere.
Discussioni simili
Autore Titolo Forum Risposte Data
M Esportare tabella in csv con intestazione di colonne PHP 6
S [PHP] Selezionare i campi non in comune con le altre colonne della tabella PHP 4
S [MS Access] Report con colonne duplicate MS Access 0
S [PHP] selezionare colonne in comune con un altra tabella PHP 5
neo996sps [PHP + MySQL] Tabella 5 colonne per N righe con un record per cella PHP 3
felino Selezionare le colonne con una certa condizione PHP 2
M Popolare una tabella con numero righe e colonne prefissate PHP 6
A help con Combobox a 2 colonne Visual Basic 0
L Template con HTML 5 a due colonne?? HTML e CSS 1
A Ciclo for su 2 colonne con limite a 10 PHP 1
N Problemi con i div per le "colonne" HTML e CSS 7
E Problema con CSS con 3 colonne HTML e CSS 5
matteoraggi Come cancellare le colonne di wordpress WordPress 0
E Tabella righe e colonne PHP 0
T colonne di tabelle mysql ordinate MySQL 0
max1974 raggruppare e girare i dati in colonne MySQL 11
A Somma delle colonne di una tabella pivot Database 6
GraceHawk ACCESS e VBA: scorrere le righe e le colonne di una tabella? MS Access 3
F [HTML] Google fogli ordinare per colonne HTML e CSS 0
Kolop [HTML] Menu a colonne stessa lunghezza HTML e CSS 7
A [HTML] due colonne responsive HTML e CSS 1
elpirata [PHP] Query per ricercare stringa in più colonne PHP 5
U [PHP - RISOLTO] Tabella dinamica: colonne selezionate da checkbox PHP 40
S [Javascript] Slider html: Mostrare immagini su 4 colonne Javascript 20
elpirata [PHP] Larghezza colonne Fpdf PHP 0
fabryx [PHP]RISOLTO: Trasformare righe in colonne assegnando singole variabili PHP 10
S [PHP] Selezionare tutte le colonne meno due PHP 6
P [HTML] [PHP] dividere lo schermo in tre colonne HTML e CSS 110
A Footer a 6 colonne equistanziato e centrato HTML e CSS 1
S Come estrapolare nomi colonne tabella e affiancare Input Radio PHP 16
K div a due colonne e div annidati HTML e CSS 17
B numero progressivo formato da tre colonne MySQL 19
M Query Join per 2 colonne MySQL 1
felino [Wordpress] Wordpress SEO Yoast: disabilitare preview colonne seo in articoli e pagine WordPress 1
G sommare valori più colonne MS Access 1
A individuazione righe e colonne XML 0
P tre colonne HTML e CSS 2
P Dividere lo schermo in tre colonne HTML e CSS 1
P [RISOLTO]Lettura e scrittura su righe e colonne excel tramite PHP... PHP 3
P Dividere lo schermo in tre colonne HTML e CSS 6
S Grafico in Chart.js colonne di colore diverso PHP 0
A Allineare due colonne in una tabella HTML PHP 6
F articoli su due colonne WordPress 5
C Dividere un div in due colonne Javascript 2
D [ACCESS] Totali su righe e colonne in una query a campi incrociati MS Access 0
Monital Ordinamento colonne PHP 40
G inserire | in 200 colonne MySQL 0
P Allargare colonne su kunena CMS (Content Management System) 4
P Layout fisso 3 colonne, problema HTML e CSS 1
N false colonne HTML e CSS 0

Discussioni simili

Alto Basso