Bootstrap buttons in one line

Question

Buttons

Here is my code, and i dont know how to place the buttons side to side. (btw I'm new at coding)

<div class="second">
           <div class="col-md-12 text-center">
               <form>
            <button class="btn btn-primary btn-lg" type="submit" formaction="1klasse.html">1.klasse </button>
               </form>
           </div>
            <div class="col-md-8 text-center">
                <form>
                    <button class="btn btn-primary btn-lg" type="submit" formaction="1klasse.html">2.klasse </button>
                </form>
            </div>
        </div>

Answer 1

Since you are using bootstrap, there are a few things you need to know:

.col class will not work without putting the class within .container and .row classes. The other important thing is that the column numeric sizes add up to 12; right now yours add to 20. So your code should look more like this:

<div class="container">
  <div class="row">
    <div class="col-12 col-md-6">
       <form>
        <button class="btn btn-primary btn-lg" type="submit" formaction="1klasse.html">1.klasse </button>
       </form>
    </div>
    <div class="col-12 col-md-6">
      <form>
        <button class="btn btn-primary btn-lg" type="submit" formaction="1klasse.html">1.klasse </button>
       </form>
    </div>
  </div>
</div>

Here is a codepen to show it working

Refer to Bootstrap documentation on grids as well

Answer 2

Just put the buttons inside the same form and div

<div class="second">
     <div class="col-md-12 text-center">
           <form>
                <button class="btn btn-primary btn-lg" type="submit" formaction="1klasse.html">1.klasse </button>
                <button class="btn btn-primary btn-lg" type="submit" formaction="1klasse.html">2.klasse </button>
            </form>
      </div>
</div>