左下にボタンを表示する方法（ASP.NETコアとブートストラップ）

Question

私はASP.NET Core Webアプリケーションを使用しており、検索結果のナビゲーションを可能にします。私はどのようにを把握しようとしていますは、左下にボタンを表示します。どうやってこれを簡単にすることができますか？

ここに画像があります。 https://i.stack.imgur.com/uyWwE.png

ここにコードがあります。

var prevDisabled = !Model.HasPreviousPage ? "disabled" : ""; 
var nextDisabled = !Model.HasNextPage ? "disabled" : ""; 

<a asp-action="Index" 
asp-route-sortOrder="@ViewData["CurrentSort"]" 
asp-route-page="@(Model.PageIndex - 1)" asp-route-currentFilterSearchBy="@ViewData["CurrentFilterSearchBy"]" currentFilterLocation="@ViewData["CurrentFilterLocation"]" 
asp-route-currentFilterItem="@ViewData["CurrentFilterItem"]" 
class="btn btn-default @prevDisabled" style="bottom:0;"> 
Previous 
</a> 
<a asp-action="Index" 
asp-route-sortOrder="@ViewData["CurrentSort"]" 
asp-route-page="@(Model.PageIndex + 1)" 
asp-route-currentFilterSearchBy="@ViewData["CurrentFilterSearchBy"]" 
asp-route-currentFilterLocation="@ViewData["CurrentFilterLocation"]" 
asp-route-currentFilterItem="@ViewData["CurrentFilterItem"]" 
class="btn btn-default @nextDisabled" style="bottom:0;"> 
Next 
</a> 

Answer 1

ブートストラップのグリッドシステムを作成しましたか？ サンプルを次のように作成する必要があります。

<div class="container"> 
    <div class="row"> 
     <div class="col-1"> 
      <div>CARD</div> 
      <div> 
       <a asp-action="Index" 
        asp-route-sortOrder="@ViewData["CurrentSort"]" 
        asp-route-page="@(Model.PageIndex - 1)" asp-route-currentFilterSearchBy="@ViewData["CurrentFilterSearchBy"]" currentFilterLocation="@ViewData["CurrentFilterLocation"]" 
        asp-route-currentFilterItem="@ViewData["CurrentFilterItem"]" 
        class="btn btn-default @prevDisabled" style="bottom:0;"> 
        Previous 
       </a> 
       <a asp-action="Index" 
        asp-route-sortOrder="@ViewData["CurrentSort"]" 
        asp-route-page="@(Model.PageIndex + 1)" 
        asp-route-currentFilterSearchBy="@ViewData["CurrentFilterSearchBy"]" 
        asp-route-currentFilterLocation="@ViewData["CurrentFilterLocation"]" 
        asp-route-currentFilterItem="@ViewData["CurrentFilterItem"]" 
        class="btn btn-default @nextDisabled" style="bottom:0;"> 
        Next 
       </a> 
      </div> 
     </div> 
     <div class="col-5"> 
      CONTENT 
     </div> 
    </div> 
</div>