problems with form (in-line)

0

Good day everyone, I'm doing social work for a faculty at my university. and I'm having a problem with a form specifically in this part.

I want to make this form but I can not do it inside the same container. I use form-inline but it only allows me to do a line and I can not follow it down. Any idea of how I can solve this problem?

btw: I'm new to this.

Code example

 <section class="container">
  <div class="row">
    <div class="col-md-12 col-center bg-yellow">
      <br>
      <div class="small-box bg-navy">
        <div class="inner">
          <form class="form-inline" action="/action_page.php">
<div class="form-group">
<label for="email">Email address:</label>
<input type="email" class="form-control" id="email">
</div>

<div class="form-group">
<label for="pwd">Password:</label>
<input type="password" class="form-control" id="pwd">
</div>
        </div>
      </div>
    </div>   
  </div>
    
asked by Jorge Luis Sanchez 30.06.2018 в 21:36
source

1 answer

0

Look, I do not have bootstrap installed, but because you do not try something of the style:

<section class="container">
    <div class="row">
        <div class="col-md-12 col-center bg-yellow">
            <br>
            <div class="small-box bg-navy">
                <div class="inner">
                    <form class="form-inline" action="/action_page.php">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="email">Email address:</label>
                                    <input type="email" class="form-control" id="email">
                                </div>

                                <div class="form-group">
                                    <label for="pwd">Password:</label>
                                    <input type="password" class="form-control" id="pwd">
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="nombre">Email address:</label>
                                    <input type="nombre" class="form-control" id="nombre">
                                </div>

                                <div class="form-group">
                                    <label for="apellidos">Password:</label>
                                    <input type="apellidos" class="form-control" id="apellidos">
                                </div>
                            </div>
                        </div>
                    </form>   
                </div>
            </div>
        </div>
    </div>
</section>

The idea is to put another div in the form with the class row and layout it there with the system of 12 columns of bootstrap

Try what I told you, and if not, try to try to create a row within <form>

Even so, even more comfortable, create your own css , for these situations the truth is that it is much better.

    
answered by 05.07.2018 в 17:25