max-width che non cambia

[rainbow.pino]

Salve a tutti
ho impostato in una pagina css queste due istruzioni:

.photo ul.topic li ul li a img 
{display:block; max-width:150px; max-height:100px;  border:5px solid #eee;}   

.photo ul.topic li a:hover ul li a:hover,  
.photo ul.topic li:hover ul li a:hover  
{white-space:normal; position:relative;}  

.photo ul.topic li a:hover ul li a:hover img,  
.photo ul.topic li:hover ul li a:hover img 
{position:absolute; left:-20px; top:-20px; max-width:300px; max-height:300px; border-color: #FFF;}

In pratica le miniature vengono visualizzate con una dimensione massima di 150x100.
Quando passo il mouse "sopra" una miniatura questa assume la sua grandezza naturale
che può essere o 300x200 o 200x300.
Questa tecnica realizzata apportando piccole modifiche alla tecnica "lightbox" funziona come potete verificare in questa pagina: passando il mouse sopra le iniature, queste si ingrandiscono.


Ora vorrei realizzare una gallery cercando di fondere la tecnica lightbox con la tecnica highslide.

qui la tecnologia Highslide che dopo una visualizzazione complessiva delle miniature
permette di scorrere le foto in formato più grande.

Il mio obiettivo era quindi utilizzare "lightbox" per la visualizzazione delle miniature
e highslide per lo scorrimento delle foto.

Però stranamente, pur funzionando tutto il resto, il secondo max-width e max-height vengono ignorati quando utilizzo le due tecniche insieme
Come si può notare l'elemento con il max-width=300px viene sentito (bordo colore verde chiaro) ma la dimensione della miniatura (che è 200x300) rimane identica.

Perchè secondo voi non viene sentito il secondo max-width e max-heigth?

grazie
Pino

[rainbow.pino]

per completezza delle informazioni:

se a posto di max-width e max-height
in entrambe le istruzioni utilizzo width ed eight funziona!

Utilizzo max-width e max-height perchè non so se la miniatura è orizzontale (300x200) o verticale (200x300).

perchè utilizzando le due tecniche insieme (lightbox + highslide) il secondo max... non funziona?

[rainbow.pino]

UP
(bellissimo cartone, ma non c'entra niente col discorso ;-)

ho provato e riprovato, ho riverificato il css e sembra corretto,
se le due istruzioni con
max-width:150px; max-heigth:150px; e
max-width:300px; max-heigth:300px;

le modifico in
width:150px; heigth:150px; e
width:300px; heigth:300px;

Funzionano!

Sembra quindi che il problema sia nell'utilizzo di max...

Qualcuno sa dirmi dove sbaglio? o è una limitazione di max... ?
grazie

[Mich_]

Non e` che per caso stai usando IE in quirks mode?

Se usi IE6- oppure usi IE7+ con DTD transitional il max-qualcosa e il min-qualcosa non funzionano

[rainbow.pino]

Originariamente inviato da Mich_
Non e` che per caso stai usando IE in quirks mode?

Se usi IE6- oppure usi IE7+ con DTD transitional il max-qualcosa e il min-qualcosa non funzionano

No. Uso quasi esclusivamente "mozilla 3.6" e per qualche test "IE 8".

cos'è quirks mode?
Temo comunque che sia proprio un limite di max...

[Mich_]

Che io sappia (e ne ho riprova da questo forum) max-width funziona in tutti i browser moderni, con l'eccezione di IE quando lavora in modalita` retrocompatibile (quirks mode).

Ma se la DTD e` Strict, IE lavora in modo standard.

L'unica altra alternativa che vedo in base a quanto hai detto, e` un errore di sintassi. Prova a farti un giro dai validatori: validatore HTML e validatore CSS.