Ciao a tutti,
ho una pagina jsp che ha un layout un po' particolare.
La pagina è una pagina che funge sia da input per una ricerca sia da output.
E' divisa in tre parti: form di ricerca, info sulla ricerca fatta, risultati della ricerca.
La ricerca e le info sulla ricerca sono messe a sinistra una sopra l'altra, il risultato invece è messo a destra.
Quello che voglio avere è il layout sopra descritto, con le tre parti contornate e con una dimensione prefissata. Quando il risultato della ricerca è piccolo, la lunghezza del riquadro che lo contiene rimane invariata, quando il risultato della ricerca è molto grande, i riquadro che la contiene deve espandersi ma gli altri due riquadri devono rimanere in alto.
Inoltre deve funzionare sia con firefox che con IE (purtroppo).
Ho realizzato questa cosa in maniera secondo me rozza, credo ci sia un metodo molto molto più banale, ma non essendo molto esperto non mi è venuto in mente.
Attualmente ho messo le tre div in una table, le div che contengono la form e le info sono sulla stessa colonna mentre la div con la query è a destra e fa rowspan su due righe.
La div di destra non ha un altezza prefissata e dovrebbe avere un'altezza minima di 700px.
Visto che IE non supporta min-height (e i workaround non sono andati a buon fine), c'è uno script che mette l'altezza a 700, qualora fosse minore di 700, quindi qualora fosse vuota o con un risultato "piccolo".
Così facendo la div ha una altezza minima e si autoespande fino all'altezza desiderata.
Ovviamente i due elementi di destra in questo modo vanno a finire al centro della pagina, mentre dovrebbero rimanere in cima, per ovviare a questo, il div di sinistra in basso, viene espanso dinamicamente in lunghezza.
Idee per migliorare il tutto?
Spero di essermi spiegato bene.
Vi scrivo rapidamente la struttura base della pagina che è comunque modificabile al 100%.
<table>
<tr>
<td><div>FORM</div></td>
<td rowspan=2><div>RISULTATO</div></td>
</tr>
<tr>
<td><div>INFO</div></td>
</tr>
</table>
Grazie
Luca