как поставить кнопку рядом с таблицей с помощью bootstrap3

Question

как установить кнопку рядом с таблицей внутри div.

мой код:

 <div class="col-xs-6">  <!-- main div -->
  <div> <!-- table div -->
    <table class="table table-bordered table-striped text-center">
      <thead><tr>
           <!-- 4 Header -->
      </tr></thead>
      <tbody> <tr><td>
            <!-- first row -->
      </td></tr></tbody>
     </table>
    </div> 
  <div class="col-xs-4">
  <div class="col-xs-2" >
    <button type="button" class="btn btn-primary"  name="search" id="search">Search</button>   
  </div>
  <div class="col-xs-2" >
    <button type="button" class="btn btn-primary"  name="add" id="add">Add</button> 
  </div>   
</div>

- основной раздел закрыть

кто яполучение:

Answer 1

поместите основной div в класс: col-xs-12

и кнопку div до col-xs-8 или col-xs-10.

Итак, main - это всего 12, в которые вы помещаетеТаблица с *-xs-2 и кнопка с *-xs-8

Попробуйте это

     <!-- 
  Bootstrap docs: https://getbootstrap.com/docs
-->
<div class="container">
<div class="row"> 
  <div class="col-xs-4"> 
    <table class="table">
    <thead>
      <tr>
        <th>Firstname</th>
        <th>Lastname</th>
        <th>Email</th>
        <th></th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>John</td>
        <td>Doe</td>
        <td>john@example.com</td>
      </tr>
    </tbody>
  </table>
  </div> 
  <div class="col-xs-8">
  <div class="row">

    <div class="col-xs-3" >
        <button type="button" class="btn btn-primary"  name="search" id="search">Search</button>   
    </div>
    <div class="col-xs-3" >
        <button type="button" class="btn btn-primary"  name="add" id="add">Add</button>  
    </div>

  </div>
   </div>
  </div>
  </div>

Проверьте это: https://jsfiddle.net/hbp71ejr/