differenza di visualizzazione tra IE e Firefox

[Pi_Dior]

Ciao a tutti stò uscendo matto con questi css, ma perchè ci devono essere sempre problemi di intrepretazione tra IE e il resto del mondo?

Vengo al quesito, in pratica il mio layout in firefox si vede come vorrei, cioè così:



mentre in IE si vede così:



cioè il contenuto del div che dovrebbe essere affiancato al div del menù, ed il footer dovrebbe essere come nell'immagine di sopra non attaccato al basso del browser

il css per il foot è così strutturato:

#foot{
    width:700px;
    height: 20px;
    text-align:left;
    background-color: #cc0000;
    background-image: url();
    background-repeat: none;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
    padding-top: 10px;
    padding-right: 0;
    padding-bottom: 0px;
    padding-left: 0;
    border-top-width: 0px;
    border-top-style: solid;
    border-top-color: #333333;
    font-size: 10px;
    color:#FFFFFF;
    clear:both;
}

questo è il box del testo:

#content {
    background-color:#FFFFFF;
    width:530px;
    margin: 0 auto;   /* centra negli altri browser */
    text-align: left;   /* ripristina l'allineamento */
    margin-right: auto;
    margin-left: 170px;
    margin-top: 10px;
    padding-top: 0px;
    padding-bottom: 10px;
    padding-right: 10px;
    padding-left: 0px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color:#333333;
    border: 0px solid rgb(51,51,51);
}

e questo è per la cella color grigio:

.div_center_menu{
    width:150px;
    height:15px;
    background-color: #CCCCCC;
    font-size: 12px;
    color: #FFFFFF;
    font-weight: bold;
    text-align: center;
}

e questo per la cella rossa che contiene la cella color grigio:

#left {
    clear:left;
    float:left;
    width:150px;
    margin:10 10 10 0;
    padding-left:0px;
    background-color: #CC0000;
} 

secondo voi da cosa dipende?

[Myaku]

vado un po' di fretta quindi non ho letto tutto il codice. Però IE aggiunge dei px di suo ai margini, quindi se la somma della dimensione dei div che flottano è uguale alla dimensione del div contenitore, IE ti fa vedere il div a dx spostato in verticale sotto rispetto a quello a sx perché per lui la somma è maggiore della larghezza del contenitore, quindi in orizzontale tutti due i div non ci stanno.

...spero di essere stata comprensibile ...

Prova a ricalcolare le larghezze dei div, se il problema è quello, puoi usare l'hack specifico per IE per attribuire le larghezze giuste per il browser.

Cyà