Кнопка изменения позиции в строке с таблицами данных пагинации

Question

Я хочу изменить положение кнопок.

Есть кнопки сравнения, сохранения макета и печати.Я хочу, чтобы кнопки были встроены в нумерацию страниц, здесь я использовал таблицы данных.

<table id="sparepart_id" cellspacing="0" border="0" class="table table-striped nowrap dataTable" style="border-collapse: collapse;">
  <colgroup span="7" width="85"></colgroup>
  <tbody id="sparepart_data">
  </tbody>
</table>
<div style="position: relative;">
  <div class="col-md-8">
    <a href="#"><button type="button" class="btn btn-primary form-input" style="border-radius: 10px;font-size:13px;">COMPARE</button></a>
    <input type="hidden" name="btn_user_filter" id="btn_user_filter">
    <button type="button" class="btn btn-default form-input" data-filterType="user" style="border-radius: 10px;font-size:13px;">Save Layout</button>
  </div>
  <div class="col-md-4"><button type="button" class="btn btn-default" data-filterType="user" style="border-radius: 10px;"><i class="fa fa-print"></i>Print</button></div>
</div>

вот мой скриншот

Answer 1

Я предполагаю, что вы используете макет boostrap

<table id="sparepart_id" cellspacing="0" border="0" class="table table-striped nowrap dataTable" style="border-collapse: collapse;">
  <colgroup span="7" width="85"></colgroup>
  <tbody id="sparepart_data">
  </tbody>
</table>
<div class="container-fluid">
<div class="row">
  <div class="col-md-8 col-sm-8 col-8">
    <a href="#"><button type="button" class="btn btn-primary form-input" style="border-radius: 10px;font-size:13px;">COMPARE</button></a>
    <input type="hidden" name="btn_user_filter" id="btn_user_filter">
    <button type="button" class="btn btn-default form-input" data-filterType="user" style="border-radius: 10px;font-size:13px;">Save Layout</button>
  </div> 
  <div class="col-md-4 col-sm-4 col-4"><button type="button" class="btn btn-default" data-filterType="user" style="border-radius: 10px;"><i class="fa fa-print"></i>Print</button></div>
</div>
</div>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">