Etichetta Bootstrap Etichetta e casella di controllo Surround

Question

Sto creando un modulo con una casella di controllo che è in linea con un input di testo. Ecco quello che ho fatto per far sembrare bello, con bootstrap:

<label class="checkbox"> 
    <input type="checkbox" name="keywords" value="__option__"> 
    <input type="text" name="keywords_other_option" value="" placeholder="Other"> 
</label> 

Sembra buono, ma non funziona bene. In Firefox, l'utente non può digitare nella casella di testo. C'è un buon modo di bootstrap per mettere la casella di spunta e il testo in linea tra loro?

Answer 1

Non inserire due elementi input all'interno di un elemento label.

Ed ecco Twitter Bootstrap modo per risolvere questo:

<form class="form-inline"> 
    <label class="checkbox"> 
    <input type="checkbox" name="keywords" value="__option__"> 
    </label> 
    <input type="text" name="keywords_other_option" value="" placeholder="Other"> 
</form> 

Ecco DEMO.

Ulteriori esempi da official documentation.