Riassumo la questione e fornisco una sintetica descrizione della soluzione, perch� possa essere utile anche ad altri.
Parliamo di uno slideshow (tipico nella header di una pagina web).
- All'interno di un DIV contenitore e' sistemata una lista non ordinata (UL LI) delle immagini da elaborare
- l'elemento UL ha POSITION: RELATIVE
- gli elementi LI hanno POSITION: ABSOLUTE (top:0, left:0)
- all'elemento UL viene assegnata una altezza (HEIGHT).
Problema
- lo slideshow non ha un corretto comportamento responsive
- restringendo la finestra (browser), accade che le immagini modificano (correttamente) la loro dimensione; la loro HEIGHT si modifica proporzionalmente alla WIDTH; l'elemento UL, invece, mantiene l'altezza assegnata.
Togliendo la HEIGHT all'elemento UL, la sua dimensione verticale resta zero e le immagini non sono visibili; accade infatti che gli elementi LI non si espandono perche' hanno POSITION: ABSOLUTE.
Soluzione (trovata in rete)
- gli elementi LI mantengono POSITION: ABSOLUTE tranne il primo, al quale viene assegnata POSITION: RELATIVE.
Questo ha risolto il problema. Lo slideshow si comporta ora in maniera responsive.