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

    Problema contenitori e sfondi

    Salve a tutti.
    Ho un piccolo problemino.
    Dunque, ho una pagina, con una contenitore "grande", il quale possiede uno sfondo.
    Dentro a questo contenitore ne ho due altri, affiancati.
    uno a sinistra, dova andrà poi il contenuto delle pagine e uno a destra, dove si trova il menu...
    il problema è che inserendo i due div in quello grande, lo sfondo (di quello grande) sparisce...
    posto il codice html:
    codice:
    <center>
       <div id="corpo">       
          <div class="contenuto">
             Bla bla.
    
             Test-Seite 
    
             Lollerolerola 
    
          </div>
          <div id="menu-box">
             <div class="menulink">Home</div>
          </div>
       </div>
       <div id="corpo-bottom"></div>
    </center>
    e il css:
    codice:
    div#corpo {
       background-image: url(img/corpo.png);
       background-repeat: repeat-y;
       width: 750px;
       position: relative;
       top: 0px;
       left: 0px;
       }
    
    div#corpo-bottom {
       background-image: url(img/corpo-bottom.png);
       background-repeat: no-repeat;
       width: 750px;
       height: 3px;
       }div.contenuto {
       width: 500px;
       position: relative;
       top: 0px;
       left: 0px;
       text-align: left;
       float: left;
       }
    
    div.contenuto {
       width: 500px;
       position: relative;
       top: 0px;
       left: 0px;
       text-align: left;
       float: left;
       }
    
    div#menu-box {
       width: 250px;
       position: relative;
       top: 0px;
       right: 0px;
       float: right;
       }
    
    div.menulink {
       background-image: url(img/menu.png);
       background-repeat: no- repeat;
       width: 239px;
       height: 45px;
       font: Verdana;
       font-size: 18px;
       color: #C9C9C9;
       text-align: center;
       line-height: 45px;
       }
    
    div.menulink:hover {
       background-image: url(img/menu-h.png);
       background-repeat: no- repeat;
       width: 239px;
       height: 45px;
       font: Verdana;
       font-size: 18px;
       color: white;
       text-align: center;
       line-height: 45px;
       }
    sapreste indicarmi il problema e una possibile soluzione?

    grazie mille

    yoplaaa

  2. #2
    up

  3. #3
    A quanto pare il problema sta nel fatto che non ho messo l'altezza del div "corpo", questo perchè vorrei fosse dinamico ( che si adatta al contenuto ).
    In ogni caso non sono ancora arrivato a una soluzione... (tranne impostare l'altezza, cosa che non voglio fare...)

  4. #4
    Utente bannato
    Registrato dal
    Sep 2009
    Messaggi
    1,737
    Per forza sparisce lasci i div all'interno attacati ai bordi del contenitore, per vedere dello sfondo sotto devi dargli dei margini

  5. #5
    ho provato, ma senza risultato... puoi spiegarmi dove esattamente devo mettere margini?

  6. #6
    Utente di HTML.it
    Registrato dal
    Sep 2002
    Messaggi
    1,056
    guarda non so se ho capito bene il problema, ma potrebbe esserti utile questo:

    http://css.flepstudio.org/css-tutorials/clearfix.html

    ovvero a quanto pare se i contenitori figli hanno il float l'altezza del contenitore padre viene azzerata.
    In questo articolo parla di firefox, ma io l'ho riscontrato anche su safari o altro..

    spero possa esserti utile

  7. #7
    Grazie mille! Anche se il problema l'ho risolto in altro modo:
    Basta togliere il position nell classe .contenuto.
    In pratica rimane: corpo (750px) con dentro contenuto di larghezza 500px e menu-box di larghezza 250px, Togliendo poi tutti i float.

    grazie mille le stesso!

    axel

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.