How to make an inline form with bootstrap without using tables

1

I'm not a designer, but I need a form inline without using a table and responsivo like the image.

I've been trying for 2 days and nothing, <label>nome campo</label> always spoils the placement of the fields.

I'm trying to do something like the attached image.

    
asked by anonymous 29.05.2015 / 16:48

3 answers

1

There is an example of how to do this in bootstrap documentation

<form class="form-inline">
  <div class="form-group">
    <label for="exampleInputName2">Name</label>
    <input type="text" class="form-control" id="exampleInputName2" placeholder="Jane Doe">
  </div>
  <div class="form-group">
    <label for="exampleInputEmail2">Email</label>
    <input type="email" class="form-control" id="exampleInputEmail2" placeholder="[email protected]">
  </div>
  <button type="submit" class="btn btn-default">Send invitation</button>
</form>
    
29.05.2015 / 17:07
0

With the bootstrap library you can do this:

<div class="row">
  <div class="col-md-6">.col-md-6</div>
  <div class="col-md-6">.col-md-6</div>
</div>
    
29.05.2015 / 16:51
0

Simple form to send message to contact

 <form method="post"">
                                    <div class="row 50%">
                                        <div class="6u"><input type="text" name="nome" placeholder="Nome" /></div>
                                        <div class="6u"><input type="text" name="email" placeholder="Email" /></div>                                    
                                    </div>
                                    <div class="row 50%">
                                    <div class="12u"><input type="text" name="assunto" placeholder="Assunto" /></div>
                                    </div>
                                    <div class="row 50%">
                                        <div class="12u">
                                            <textarea name="mensagem" placeholder="Mensagem"></textarea>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="12u">
                                            <h2 id="aguarde"  style="display:none;" class="answer_list" >Aguarde...</h2>
                                            <input type="submit" value="Enviar/>                                    
                                        </div>                                  
                                    </div>                                                              
                                </form>

I learned about bootstrapping with an example of cool websites with HTML5 CSS3 and Bootstrap. FIXING: link downloads a sample website and makes the party.

    
29.05.2015 / 16:57