Problema con Float e immagini

[ideasiti]

Problema con Float e immagini

Ciao a tutti, ho realizzato un layout usando 2 div affiancati con float:left
Poichè vi sono immagini all'interno di entrambi i div ho visto che nella risoluzione 800x600 il div di destra invece di stare accanto all'altro va a capo lasciando la pagina mezza bianca.

Su Firefox tutto funziona correttamente, perchè anche se rimpicciolisco lo schermo o ridimensiono la finestra ho una parziale sovrapposizione delle immagini.

Come posso fare a risolvere il problema su Explorer? C'è un modo per non fare andare a capo il div anche se i pixel delle immagini contenute in essi superano le dimensioni totali dello schermo?

Esempio...
div di navigazione bottone da 200 px
div laterale ha un immagine di 605 px

il totale è 805 e il blocco a destra va a capo.. come posso impedirlo?

Grazie a tutti spero di essermi spiegata

[laburno]

Ciao ideasiti,
i due div hanno padding/margini/bordi? IE interpreta in modo non corretto queste proprietà.

[stucco]

@Laburno said:

IE interpreta in modo non corretto queste proprietà.

Quoto Laburno e ti suggerisco di leggere questo articolo

[ideasiti]

Scusate il ritardo.. ero in vacanza, e sono appena tornata!!
I margini dei due div li ho impostati con un foglio di stile esterno e sono i seguenti

[HTML]#colonna30_a {width:20%; font-size:80%; line-height:1.7em; float:left;}
#colonna30_b {width:75%; font-size:80%; line-height:1.7em; float:left; padding-top:0%; padding-left:2%; padding-right:2%; padding-bottom:0%; overflow:hidden; }[/HTML]

Aggiungendo il parametro overflow:hidden; ho risolto parzialmente il problema.
Grazie, Laura

[laburno]

Che intendi per parzialmente?
Il sito è quello in firma?

Ma il div ti va a capo solo se contiene un'immagine che non riesce a contenere?

[ideasiti]

Ciao, il sito è il seguente

http://www.devotoracing.eu/photogallery-016.php

per parzialmente intendo che se ridimensiono la finestra con explorer, fino ad un certo ridimensionamento non succede nulla ma se la restringo ulteriormente l'immagine di destra va a capo..

[meryk]

Su firefox e Ie7 funzionano allo stesso modo.
Con questa struttura di Html non mi viene in mente nulla per sistemarlo e farlo andare anche sulla versione 6 (a meno di rimpicciolire l'immagine/dare una dimensione fissa al div colonna_b --> ie manda a capo quando il contenuto del div è più grande della dimensione del div stesso che in questo caso è del 75%. Tieni conto che quel contenuto è in una tabella... ).
Fai attenzione a qualche errorino nel codice, ad esempio aprire un div dentro ad un tag a!
Buon Lavoro!

Mery

[laburno]

Ci sarebbe il min-width come soluzione, ma per implementarlo in IE saresti punto e a capo.

Come ti consiglia Meryk, anche io rivedrei la struttura del tuo layout.