【发布时间】：2020-09-18 16:39:00
【问题描述】：
我正在尝试将我的引导列对齐到它显示 TEST 的位置，使其位于 Build 信息列下方，但它只是位于屏幕底部。我只是不知道如何实现这一目标。我遵循了许多教程，但总是在左下角结束。有人可以帮忙吗？谢谢。
这是我的代码...
<div class="row">
<div class="col-lg-7">
<div class="card w-100">
<h5 class="card-header">Single Stage Terminal</h5>
<div class="card-body">
<div class="container">
<div class="row">
<div class="col-sm-4" style="font-weight:bolder">
Order Number:
</div>
<div class="col-sm-8">
<strong>@Model.OrderNumber</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-4" style="font-weight:bolder">
Stage:
</div>
<div class="col-sm-8">
<strong> @Model.Stage</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-4" style="font-weight:bolder">
Item Number:
</div>
<div class="col-sm-8">
<strong> @Model.ItemNumber</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-4" style="font-weight:bolder">
Description:
</div>
<div class="col-sm-8">
<strong> @Model.Description</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-4" style="font-weight:bolder">
Build Standard:
</div>
<div class="col-sm-8">
<strong> @Model.BuildStandard</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-4" style="font-weight:bolder">
Priority:
</div>
<div class="col-sm-8">
<strong> @Model.Priority</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-4" style="font-weight:bolder">
Process Trial:
</div>
<div class="col-sm-8">
<strong> @Model.ProcessTrial</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-4" style="font-weight:bolder">
Parent Item:
</div>
<div class="col-sm-8">
<strong> @Model.ParentItem </strong><b style="color:forestgreen; margin-left:50px;">@Model.LeadFree</b>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-4" style="font-weight:bolder">
Order Status:
</div>
<span class="br"></span>
<div class="col-sm-8">
<strong> @Model.OrderStatus</strong>
</div>
</div>
<div class="card-body w-100 border" style="margin-right:1px;">
<span class="blinking" style="color:red; margin-left:1px;">@Model.WarningCheck</span>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-5">
<div class="card w-100">
<h5 class="card-header">Build Information</h5>
<div class="card-body">
<div class="container">
<div class="row">
<div class="col-sm-6" style="font-weight:bolder">
DR Order Quantity:
</div>
<div class="col-sm-6">
<strong style="text-align:center">@Model.DrOrderQty</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-6" style="font-weight:bolder">
Allocated:
</div>
<div class="col-sm-6">
<strong> @Model.Allocated</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-6" style="font-weight:bolder">
Scanned Quantity:
</div>
<div class="col-sm-6">
<strong> @Model.ScannedQty</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-6" style="font-weight:bolder">
Remaining:
</div>
<div class="col-sm-6">
<strong> @Model.Remaining</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-6" style="font-weight:bolder">
Total Std Hours:
</div>
<div class="col-sm-6">
<strong> @Model.TotalStdHrs</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-6" style="font-weight:bolder">
Schedule:
</div>
<div class="col-sm-6">
<strong> @Model.Ok</strong>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-5">
<div class="card w-100">
<h5 class="card-header">TEST</h5>
<div class="card-body">
<div class="container">
<div class="row">
<div class="col-sm-6" style="font-weight:bolder">
DR Order Quantity:
</div>
<div class="col-sm-6">
<strong style="text-align:center">@Model.DrOrderQty</strong>
</div>
</div>
<span class="br"></span>
<div class="row">
<div class="col-sm-6" style="font-weight:bolder">
Allocated:
</div>
<div class="col-sm-6">
<strong> @Model.Allocated</strong>
</div>
</div>
<span class="br"></span>
</div>
</div>
</div>
</div>
</div>
我还将测试列放入一个新行并附加行 justify-content-end 但这只是将我的文本列放在右侧但在两个元素下方
【问题讨论】：
标签： css twitter-bootstrap view