Skip to main content
Tweeted twitter.com/StackOverflowPT/status/671117017697624064
adicionou 394 caracteres ao conteúdo
Fonte Link
Ricardo
  • 5,7mil
  • 3
  • 28
  • 54

O resultado desse meu form coloca os checkbox e labels em linha, o que está correto, mas não consigo achar uma classe do bootstrap que faça o label alinhas com o checkbox.

Como eu faço isso?

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<form action="/video/genresfilter" method="post" class="form-inline">

<label><input id="Check1" name="Check1" type="checkbox" value="Check1">Check1</input></label>

<label><input id="Check2" name="Check2" type="checkbox" value="Check2">Check2</input></label>
                                                                                            
<label><input id="Check3" name="Check3" type="checkbox" value="Check3">Check3</input></label>
                                                                                              
</form>

ATUALIZANDO

inserir a descrição da imagem aqui

A foto acima é o resultado atual, quero que a caixa do checkbox fique alinhada com a label Checkbox1, no resultado atual parece que a caixa está alinhada acima e precisaria ficar centralizada.

O centro da caixa deve coincidir com o centro da letra "C" da palavra Checkbox...

O resultado desse meu form coloca os checkbox e labels em linha, o que está correto, mas não consigo achar uma classe do bootstrap que faça o label alinhas com o checkbox.

Como eu faço isso?

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<form action="/video/genresfilter" method="post" class="form-inline">

<label><input id="Check1" name="Check1" type="checkbox" value="Check1">Check1</input></label>

<label><input id="Check2" name="Check2" type="checkbox" value="Check2">Check2</input></label>
                                                                                            
<label><input id="Check3" name="Check3" type="checkbox" value="Check3">Check3</input></label>
                                                                                              
</form>

O resultado desse meu form coloca os checkbox e labels em linha, o que está correto, mas não consigo achar uma classe do bootstrap que faça o label alinhas com o checkbox.

Como eu faço isso?

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<form action="/video/genresfilter" method="post" class="form-inline">

<label><input id="Check1" name="Check1" type="checkbox" value="Check1">Check1</input></label>

<label><input id="Check2" name="Check2" type="checkbox" value="Check2">Check2</input></label>
                                                                                            
<label><input id="Check3" name="Check3" type="checkbox" value="Check3">Check3</input></label>
                                                                                              
</form>

ATUALIZANDO

inserir a descrição da imagem aqui

A foto acima é o resultado atual, quero que a caixa do checkbox fique alinhada com a label Checkbox1, no resultado atual parece que a caixa está alinhada acima e precisaria ficar centralizada.

O centro da caixa deve coincidir com o centro da letra "C" da palavra Checkbox...

Fonte Link
Ricardo
  • 5,7mil
  • 3
  • 28
  • 54

Como alinhar checkbox e label com bootstrap

O resultado desse meu form coloca os checkbox e labels em linha, o que está correto, mas não consigo achar uma classe do bootstrap que faça o label alinhas com o checkbox.

Como eu faço isso?

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<form action="/video/genresfilter" method="post" class="form-inline">

<label><input id="Check1" name="Check1" type="checkbox" value="Check1">Check1</input></label>

<label><input id="Check2" name="Check2" type="checkbox" value="Check2">Check2</input></label>
                                                                                            
<label><input id="Check3" name="Check3" type="checkbox" value="Check3">Check3</input></label>
                                                                                              
</form>