problema con IE7

diemme

problema con IE7

ho un problema di visualizzazione, mentre con ff e ie6 vedo tutto corretto, con ie7 ho dei problemi con il blocco a destra.
la pagina è questa
http://alcoro.auxonet.com/products_en.asp
mi sapete aiutare

meryk

ciao diemme, e benvenuto.

Ho dato un'occhiata sia al codice html sia al css, e posso dire che ci sono delle scelte di progettazione che non ho compreso (e in parte non condivido!)fino in fondo.
Non sono riuscita a capire per quale motivo IE7, letteralmente INCASTONI il div #corpo #contenitore_composizione #dx_sotto ad una determinata altezza, a prescindere dalla dimensione dell'altezza del div precedente.

Se vuoi scoprire quale proprietà dà problemi, il mio consiglio è di andare a ritroso nella scrittura del css, eliminando elementi e vedendo cosa succede... (ci sono anche delle proprietà ridondanti...) il resto rimane uno dei grandi misteri dell'umanità...:?

L'unica soluzione ***farlocca ***che mi è venuta in mente è la seguente: aggiungere un div nell'htm tra #composizione e , con un'altezza definita in base alle tue esigenze grafiche, in modo che "scivoli" verso il basso.
Naturalmente la grafica cambierà anche su firefox, pertanto lo stile di questo div dovrà essere definito su un foglio di stile visibile solo sul Explorer 7 (su questo forum troverai le indicazioni per farlo).
Ti posto l'esempio del codice con lo stile in line: ora ti rimane che dare un id al div, mettere il salto condizionale per explorer7, scrivere le proprietà nel foglio di stile, e fare un po' di prove per trovare la dimensione corretta!

<div id="contenitore_composizione" style="border:1px solid red;">
        <div id="dx_sopra"><div id="composizione" style="border:1px solid green">
        [...]
            </div>
    </div>
   ** <div style="clear:both; border:1px solid blue; height:150px;"> ***<!-- togliere lo stile in linea e scrivere
     una classe nel foglio di stile per IE7-->*</div>
        <div id="dx_sotto" ><img name="dx_sotto" src="products_en_files/dx_sotto.jpg" alt="" border="0" height="65" width="329">
</div>
        <div id="aiuto_composizione">
            <img src="products_en_files/icona_info.jpg" hspace="5" vspace="3">
            <ul>
            <li>The "X" cancels your last chosen ring.</li>
            <li><b>CLEAR:</b> cancels your whole creation.</li>
            <li><b>STORE:</b> authorised dealer.</li>
            <li><b>PRINT:</b> prints your creation with prices and reference numbers.</li>
            </ul>
        </div>

...spero di essere stata chiara!

Buon lavoro!

meryK

diemme

Grazie, proverò come mi hai detto