Vai al contenuto

"Attaccare due Div"


magomac

Messaggi raccomandati

Ciao a tutti.

Qual'è il metodo più corretto (e possibilmente compatibile sia con Safari-Firefox, che con IE) per far si che due DIV posti uno sotto l'altro (ad esempio quello con la barra di navigazione del sito, e quello con le pagine) siano perfettamente contigui senza neanche un pixel di spazio tra i due?

Grazie ciao

Link al commento
Condividi su altri siti

  • 3 settimane dopo...

Scusate per il ritardo ma ecomi di ritorno.

Ho provato con i vostri consigli ma non riesco a risolvere il mio problema..

Ho un sito in HTML formato da 3 "sezioni": la barra dei menù, la pagina, ed il footer. Queste tre sezioni devono essere centrate nella pagina e perfettamente "saldate" tra loro.

Per ora usavo questa struttura che funziona benissimo con Safari e Firefox. Su IE invece c'è un pixel di spazio tra la barra e la pagina.

HTML:

<center>
                 <div class="divMenu">... </div>

                 <div class="divPrincipale">
                                <!--In alcune pagina all'interno di questo div è presente:-->
                                     <div class="containerTesto">...</div>
                 </div>

                  <div class="DIVrigaFinale"></div>
</center>

CSS

.divMenu {
margin: 0px;
width: 900px;
border:none;
vertical-align: bottom;
padding:0;
}
.divPrincipale {
background-color: #FFFFFF;
width: 900px;
border:none;
vertical-align: top;
height:auto;
background-position:top;
margin: 0px;
padding-top: 10px;
padding-right: 0px;
padding-bottom: 10px;
padding-left: 0px;
font-size: 12px;
}
.DIVrigaFinale {
height:15px;
width:900px;
margin: 0px;
padding: 0px;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
background-image: url(/Segre2008/immagini/rigaBottom.gif);
background-repeat:no-repeat;
}
.containerTesto {
margin: 0px;
padding: 0px;
width: 80%;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
vertical-align: bottom;
height:auto;
background-position:top;
margin: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-bottom:0;
text-align:justify;

}

Ho provato a mettere in pratica i vostri suggerimenti ma ho fatto solo casino: inspiegabilmente, SONO IN ALCUNE PAGINE, si è creato un gigantesco spazio bianco tra il div principale e quello inferiore.....

Sono convinto che il css sia pieno di ripetizioni e cose inutili ma ho fatto vari esperimenti.

Esattamente come posso correggere il tutto perchè funzioni bene?

Grazie. ciao

Link al commento
Condividi su altri siti

Archiviato

Questa discussione è archiviata e chiusa a future risposte.

×
×
  • Crea Nuovo...