Visualizzazione dei risultati da 1 a 5 su 5

Discussione: Centrare più DIV

  1. #1

    Centrare più DIV

    Buonasera!

    Ho 3 div, uno attaccato all'altro tramite la proprietà "float: left;" e non riesco a centrarli nella pagina anche mettendo ad ognuno di essi le proprietà "margin-left: auto; margin-right:auto".
    Come posso fare?

    Per intenderci questo è il codice html
    codice HTML:
    <div id=colonna1>
       Contenuto colonna 1
    </div>
    <div id=colonna2>
       Contenuto colonna 2
    </div>
    <div id=colonna3>
       Contenuto colonna 3
    </div>
    E questo il css
    codice:
    #colonna1 {
       width: 100px;
       float: left
    }
    #colonna2 {
       width: 200px;
       float: left
    }
    #colonna3 {
       width: 100px;
       float: left
    }

  2. #2
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    inseriscili in un div la cui larghezza sia la somma delle larghezze dei tre e assegna al contenitore un margin:0 auto

  3. #3
    Fatto. Non funziona lo stesso
    Il codice è questo:
    codice HTML:
    <div id=contenitore>
      <div id=colonna1>
         Contenuto colonna 1
      </div>
      <div id=colonna2>
         Contenuto colonna 2
      </div>
      <div id=colonna3>
         Contenuto colonna 3
      </div>
    </div>
    codice:
    #colonna1 {
       width: 100px;
       float: left
    }
    #colonna2 {
       width: 200px;
       float: left
    }
    #colonna3 {
       width: 100px;
       float: left
    }
    #contenitore {
       width:400px;
       margin: 0 auto;
    }

  4. #4
    Utente di HTML.it L'avatar di Prill
    Registrato dal
    Oct 2006
    Messaggi
    2,947
    se non funziona qualcoda prima influisce sul div successivo, magari dei float non interrotti. Se è così aggiungi un clear al div contenitore

  5. #5
    Risolto!
    Ho dovuto mettere in #contenitore l'attributo "display:table;"
    Grazie comunque dell'aiuto!

Tag per questa discussione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.