php - 在 laravel 中对齐 Bootstrap 网格

Question

目前我在一个页面中有 Bootstrap 网格，如下图所示。

My Bootstrap Grids

我想要如下图所示的带有红色指示器的网格

Wanted my Bootstrap Grid Like This

代码

<div class="row">
<div class="col-md-6">
<form style="border: 4px solid #a1a1a1;margin-top: 15px;padding: 10px;" action="#" class="form-horizontal" method="post" enctype="multipart/form-data">
    <label>My label</label>
    <input type="hidden" name="_token" value="{{ csrf_token() }}">
    <input type="file" name="import_file"/> <br>
    <button class="btn btn-primary">Import File</button>
</form>
</div>

<div class="col-md-6">
<form style="border: 4px solid #a1a1a1;margin-top: 15px;padding: 10px;" action="#" class="form-horizontal" method="post" enctype="multipart/form-data">
    <label>My label</label>
    <input type="hidden" name="_token" value="{{ csrf_token() }}">
    <input type="file" name="import_file"/> <br>
    <button class="btn btn-primary">Import File</button>
</form>
</div>

<div class="col-md-6">
<form style="border: 4px solid #a1a1a1;margin-top: 15px;padding: 10px;" action="#" class="form-horizontal" method="post" enctype="multipart/form-data">
    <label>My label</label>
    <input type="hidden" name="_token" value="{{ csrf_token() }}">
    <input type="file" name="import_file"/> <br>
    <button class="btn btn-primary">Import File</button>
</form>
</div>

<div class="col-md-6">
<form style="border: 4px solid #a1a1a1;margin-top: 15px;padding: 10px;" action="#" class="form-horizontal" method="post" enctype="multipart/form-data">
    <label>My label</label>
    <input type="hidden" name="_token" value="{{ csrf_token() }}">
    <input type="file" name="import_file"/> <br>
    <button class="btn btn-primary">Import File</button>
</form>
</div>
</div>

Answer 1

为你的最后一列添加一些偏移量，比如:

   <div class="col-md-6 col-md-offset-3">
<form style="border: 4px solid #a1a1a1;margin-top: 15px;padding: 10px;" action="#" class="form-horizontal" method="post" enctype="multipart/form-data">
    <label>My label</label>
    <input type="hidden" name="_token" value="{{ csrf_token() }}">
    <input type="file" name="import_file"/> <br>
    <button class="btn btn-primary">Import File</button>
</form>
</div>