Geek asks and answers

Check mark and bootstrap label entry

I am making a form that has a checkbox that is embedded in text input. Here is what I did to make it look good with bootstrap:

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

It looks good, but it does not work well. In firefox, the user cannot enter a text field. Is there a good way to bootstrap to check the box and text embedded in each other?

+5
source share
1 answer

Do not put two elements inputinside the same element label.

And here's Twitter Bootstrap's way for this:

<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>

Here is the DEMO .

See more examples from the official documentation .

+20
source

More articles:


All Articles