Problema layout formato da 3 immagini

30-11-2009, 19.26.21

Salve a tutti, sto creando un layout che ha come sfondo 3 immagini, una che si posiziona in alto alla pagina, con altezza fissa, una centrale che si allarga in base al contenuto della pagina, ed una finale, che segue la centrale e si posiziona infondo alla pagina.

Praticamente quando nella pagina viene inserito contenuto (nel div centrale, cioè quello che ha come sfondo l'immagine centrale) l'immagine centrale si deve allungare a seconda della altezza del contenuto, dopo di che, sotto ad essa si dovrà posizionare la terza ed ultima immagine, che dovrà chiudere il template.

Come posso fare ad inserirle tutte correttamente con css in una pagina ? (nella pagina il layout è formato da div che hanno classi specifiche, ad esempio il div con la prima immagine di sfondo ha una classe specifica, ecc...)

P.S.:
In pratica la prima e l'ultima immagine contengono un menu, fisso che non si deve allargare in base al contenuto, mentre quella centrale sì.

Il codice del layout della pagina dovrà essere il seguente:

Codice HTML:

<body class="body"> // Classe del body

  	<?php echo menu_alto(); ?> // Funzione che posiziona in modo assoluto le voci del menu alto 
    <?php echo menu_basso(); ?> // Funzione che posiziona in modo assoluto le voci del menu basso 

<div class="prima_immagine">
    </div>


    
    
<div class="seconda_immagine">			
    Qui ci va il contenuto!
</div>

<div class="terza_immagine">
</div>
</body>

Spero in qualche risposta, grazie in anticipo.

01-12-2009, 15.36.58

Due sono le vie, o trovi qualcuno o qualcosa che ti dia già tutto pronto oppure impari ad usare i css :D

01-12-2009, 17.17.31

Ho scritto qui proprio per vedere se qualcuno mi poteva aiutare con la parte del css ;)

01-12-2009, 21.53.47

prova con questo codice

Codice HTML:

</head>
<body style="background-image: url('SFONDO ESTERNO')"
<br><center>
</TABLE>
<TABLE border=0 cellpadding=10 cellspacing=0 width=100%><TR><TD><font face="Arial"><span style="font-size: 10pt"><div>
<div><center>
<table cellspacing="0" cellpadding="0" width="200" background="IMMAGINE 2 CENTRALE" border="0">
<tbody>
<tr>
<td><img alt="" src="IMMAGINE 1SOPRA" /></td></tr>
<tr>
<td nowrap="nowrap">


<p align="center"><font color="#ffff99"><img src="IMMAGINE GRANDE IN MEZZO" border="0" /></font></p><br>
<br>


<p align="center">&nbsp;</p>

<p>&nbsp;</p>
</td></tr>
<tr>
<td><img alt="" src="IMMAGINE 3 FINE" /></td></tr></tbody></table></div></div></span></font></TD></TR></TABLE></TD></TR></TABLE>
<BR><BR>

03-12-2009, 15.51.28

Ora provo, grazie della risposta^^

Discussione: Problema layout formato da 3 immagini

LinkBack

Strumenti discussione

Display

Problema layout formato da 3 immagini

layout a 3 immagini

Regole di scrittura