Visualizzazione dei risultati da 1 a 3 su 3
  1. #1

    Aiuto per posizionamento div

    Salve a tutti,

    Anche se ho un po' di esperienza con il CSS sono tre ore che mi sto dannando per risolvere un problema apparentemente semplicissimo. In pratica sto creando una pagina con header, contenuto e footer:

    codice:
    <head>
    
    <title>Prova</title>
    
    <style type="text/css">
    
    body {
         text-align: center;
    }
    
    #container {
         margin: 0px auto 0px auto;
         width: 500px;
    }
    
    #header, #footer {
         background: #999999;
         width: 500px;
    }
    
    #main {
         background: #DDDDDD;
         height: auto;
         margin: 0px auto 0px auto;
         width: 500px;
    }
    
    </style>
    
    </head>
    
    <body>
    
    <div id="container">
    
    <div id="header">Header</div>
    
    <div id="main">
    
    Riga 1
    
    Riga 2
    
    Riga 3
    
    </div>
    
    <div id="footer">Footer</div>
    
    </div>
    
    </body>
    
    </html>
    Il problema è che all'interno del div "main", al posto di Riga 1, Riga 2 e Riga 3, devo inserire altri due div, uno a destra e uno a sinistra (per esempio uno largo 200 pixel per il menu e l'altro largo 300 per il contenuto). Ho provato in tutti i modi, ma il risultato è sempre lo stesso: il footer non tiene conto della loro altezza e rimane in cima, attaccato all'header. Ho provato con vari tipi di posizionamenti e di float, ma niente da fare.

    Qualcuno sa come creare questi due div e fare in modo che il footer ne tenga conto e rimanga sotto di loro, qualunque sia la loro altezza? (non deve essere fissa ma deve dipendere dal testo inserito)

    Grazie.

  2. #2
    Aggiungi

    #footer {clear:both}
    Fantasupermegafavolipermeramagicultra irresistibili
    4 10 30 100 1001 personaggi insuperabili fantaincredibili ultraimpossibili iperterribili irresistibili!!!

    "... a quell'età ... bastava un dito per fare la pace ..."
    fotine

  3. #3
    Originariamente inviato da ricman
    Aggiungi

    #footer {clear:both}
    Ha funzionato, grazie!

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 © 2026 vBulletin Solutions, Inc. All rights reserved.