• User

    Problema Concettuale Box Model

    Ciao a tutti.
    Ho un dubbio concettuale per quanto riguarda il box model.
    Non ridete per la semplicità del quesito.
    Per costruire una finestra che che non sia semplicemente bordo e sfondo ho usato questo metodo:

    1. ho creato un div contenitore
    2. ho inserito un'immagine che faccia da testata
    3. ho creato un div, per il contenuto, con un'immagine di sfondo che si ripete nell'asse y
    4. ho chiuso il div del contenuto
    5. ho inserito l'immagine di chiusura pagina
    6. ho chiuso il div contenitore

    Concettualmente ho sbagliato qualche passaggio?
    C'è un modo meno intrecciato per crearlo?
    Per quanto riguarda l'accessibilità c'è un modo migliore?

    Questo è il codice di una finestra tipo.

    
     
    <div class="colonna centrodestra">
    <img src="immagini_struttura/phi_foglioCentroDestraTesta.png">
    <div class="testo cen_des">
    <p class="attenzione"><span class="data">06-10-2007</span> - &Eacute; on line la nuova versione grafica del <a href="PHI_sitoPhi.htm">sito PHI</a>. &Eacute; stato effettuato un restyling del sito mantenendo la colorazione azzurra e seguendo uno stile "blog" così da lasciare una struttura ben organizzata e pulita.</p>
    <p class="news"><span class="data">29-09-2007</span> - &Eacute; terminata la realizzazione del <a href="PHI_logomicro.htm">logo per i Microbi</a>. Lo stile segue una linea semplice e colorata con semplicità e una grafica che richiama i destinatari del servizio che sono i bambini.</p>
    <p class="news"><span class="data">27-09-2007</span> - &Eacute; pronto il nuovo <a href="PHI_catalogoExcelsior.htm">catalogo della cooperativa Excelsior</a>. All'interno potete trovare un design accattivante e una cura nelle informazioni. All'inizio del catalogo è prevista una sezione che spiega come utilizzare il catalogo che si basa su di un sistema cromatico personalizzato.</p>
    </div>
    <img class="decor" src="immagini_struttura/phi_foglioCentroDestraPiede.png">
    </div>
    
    

    Questo è il codice CSS

    
     
    .colonna{
    text-align:center;
    color:#00669a;
    margin:0;
    padding:0;
    border:0;
    float:left;
    }
     
     
    .centrodestra{
    float:left;
    width:500px;
    margin:0px 0px 0px 10px;
    }
     
     
    .testo {
    border:0;
    margin:0;
    text-align:center;
    padding:0 10px;
    }
     
     
     
    .cen_des {
    background:url(immagini_struttura/phi_foglioCentroDestraSfon.png) top left repeat-y;
    margin:-8px 0 0 0;
    }
     
     
    
    

    Il problema è che così facendo tra l'immagine e il testo mi compare una riga vuota. Quindi ho pensato che concettualmente ho sbagliato qualcosa e che ci fosse un modo più diretto e che non riscontri questo problema.

    GRAZIE MILLE A CHIUNQUE RISPONDERA':wink3:


    autumn