Visualizzazione dei risultati da 1 a 1 su 1
  1. #1
    Utente di HTML.it
    Registrato dal
    May 2007
    Messaggi
    248

    label input layout con CSS

    salve,
    non riesco a capire come posizionare i campi label ed input attraverso i css. Conil codice html ci sono riuscito con l'uso del solo selettore label nel CSS.

    Chiarisco, clikkando sotto, sulla scritta Immagine, c'è quello che vorrei realizzare:
    Immagine

    Di seguito il codice html:
    <h1>Titolo</h1>


    <b>Es. 1</b>
    <div >
    <label for="Cognome" >Cognome</label>
    <input id="Cognome" name="Cognome" type="text" required>


    <label for="Nome" >Nome</label>
    <input id="Nome" name="Nome" type="text" required>


    <label for="Indirizzo">Indirizzo</label>
    <input id="Indirizzo" name="Indirizzo" type="text" required>


    <label for="Citta" >Città</label>
    <input id="Citta" name="Citta" type="text" required>
    </div>


    <br /> <hr /> <br />


    <b>Es. 2</b>
    <div >
    <label for="Cognome" >Cognome</label>
    <input id="Cognome" name="Cognome" type="text" required>
    </div>
    <div>
    <label for="Nome" >Nome</label>
    <input id="Nome" name="Nome" type="text" required>
    </div>
    <div>
    <label for="Indirizzo">Indirizzo</label>
    <input id="Indirizzo" name="Indirizzo" type="text" required>
    </div>
    <div>
    <label for="Citta" >Città</label>
    <input id="Citta" name="Citta" type="text" required>
    </div>


    <br /> <hr /> <br />


    <b>Es. 3</b>
    <div >
    <label for="Cognome" >Cognome</label>
    <input id="Cognome" name="Cognome" type="text" required>

    <label for="Nome" >Nome</label>
    <input id="Nome" name="Nome" type="text" required>
    </div>
    <div>
    <label for="Indirizzo">Indirizzo</label>
    <input id="Indirizzo" name="Indirizzo" type="text" required>

    <label for="Citta" >Città</label>
    <input id="Citta" name="Citta" type="text" required>


    </div>

    CSS:
    label { width: 90px; display: inline-block; text-align: right; }


    Con questo codice html:
    <div >
    <label for="Cognome" >Cognome</label>
    <input id="Cognome" name="Cognome" type="text" required>


    <label for="Nome" >Nome</label>
    <input id="Nome" name="Nome" type="text" required>


    <label for="Indirizzo">Indirizzo</label>
    <input id="Indirizzo" name="Indirizzo" type="text" required>


    <label for="Citta" >Città</label>
    <input id="Citta" name="Citta" type="text" required>
    </div>

    ed modificando solo CSS vorrei ottenere lo stesso risultato dato da link Immagine

    Spero di essere stato chiaro


    grazie
    Immagini allegate Immagini allegate

Tag per questa discussione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.