• Bannato User Attivo

    <fieldset> e <legend>: posso usarli fuori da un form?

    Ho un dubbio.
    I campi fieldset e legend possono essere usati solamente nei form?

    Mi sarebbe utile organizzare anche la visualizzazione dei dati (per esempio di una recensione) in quel modo.

    Ho visto che graficamente parlando mi troverei meglio e viene fuori una bella paginetta... che usando i Div non sarei in gradi di fare.

    Incorro in fuori standard o è una pratica comune?

    Vorrei fare l'effetto della tabella con il titolo in alto e con il bordo interrotto, come fatto in questo form:
    http://www.gdesign.it/pages/howto/articoli/formh/codice_esempio_css_html.htm

    ma con i div non ci riesco.

    Se non ci sono problemi ad usare fieldset e legend per mostrare dei dati non ho problemi... Altrimenti come realizzo quel layout?


  • Moderatore

    crei un div e lo posizioni in modo assoluto spostandolo di altezza div/2 in alto utilizzando margin:-(altezza da spostare).

    :ciauz:


  • Bannato User Attivo

    Ci provo ma so già che no otterrò quel risultato.

    Allora, creo un div che mi fa da frameset e ci applico il bordino.Poi creo un secondo div che mi fa il "legend", ci metto position absolute e poi lo sposto in alto di una quantità pari a metà della sua altezza e verso destra di tot pixel.

    E per quanto riguarda l'uso di frameset e legend per un non form? E' non conforme agli standard giusto?

    Graziem Massy sei estremamente gentile!


  • Bannato User Attivo

    Grazieeeeee. Ci sono riuscito!
    Ecco le classi "rozze" che ho creato.
    Ora procedo con il codice di struttura. Forti questi DIV... in 4 secondi modifichi l'aspetto del sito!

    /* contenitore di livello 1 */
    .setliv01 {
    border:1px solid #000000;
    padding:12px;
    margin-top: 24px;
    }
    /* intestazione (ex legend) di livello 1 */
    .intliv01 {
    	position: absolute;
    	font-size: 100%;
    	border: 1px solid;
    	background-color: #efefef;
    	color: #cc0000;
    	padding: 3px;
    	margin-top: -24px;
    	margin-left: 5px;
    }
    
    /* contenitore di livello 2 */
    .setliv02 {
    	border: 1px dashed Silver;
    	padding: 12px;
    	margin-top: 20px;
    }
    
    .intliv02 {
    	position: absolute;
    	font-size: 76%;
    	border: 1px solid;
    	background-color: #DCDCDC;
    	color:;
    	padding: 2px;
    	margin-top: -20px;
    	margin-left: 21px;
    }