twitter-bootstrap - 表单中输入字段的右对齐不起作用
问题描述
我有一个包含三列和每列中多对标签+输入的表单。我正在努力让输入字段与行的右端对齐。我曾经在引导程序 3 中为此使用 pull-right,但无法弄清楚与 V5 中的等价物是什么。我已经尝试过justify-content-end
, float-right
,align-items-right
但没有效果。
这就是它目前的样子:
<form>
<div class="row">
<div class="col-md-4">
<div class="row m-1">
<label class="col-sm-5 col-form-label">PurchasePrice</label>
<div class="col-sm-4 align-self-end d-flex justify-content-end">
<input asp-for="PurchasePrice" class="form-control align-self-end d-flex justify-content-end" />
<span asp-validation-for="PurchasePrice" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label class="col-sm-5 col-form-label">BasicPrice</label>
<div class="col-sm-4">
<input asp-for="BasicPrice" class="form-control float-right" />
<span asp-validation-for="BasicPrice" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label class="col-sm-5 col-form-label">Discount</label>
<div class="col-sm-4">
<input asp-for="Discount" class="form-control float-right" />
<span asp-validation-for="Discount" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label asp-for="RetailPrice" class="col-sm-5 col-form-label">RetailPrice</label>
<div class="col-sm-4">
<input asp-for="RetailPrice" class="form-control float-right" />
<span asp-validation-for="RetailPrice" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label asp-for="IncludedDealerOptionPrice" class="col-sm-5 col-form-label">Gesamtnachlass auf Basisfahrzeug</label>
<div class="col-sm-4">
<input asp-for="IncludedDealerOptionPrice" class="form-control float-right" />
<span asp-validation-for="IncludedDealerOptionPrice" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label asp-for="Listprice" class="col-sm-5 col-form-label">ListPrice</label>
<div class="col-sm-4">
<input asp-for="ListPrice" class="form-control float-right" />
<span asp-validation-for="ListPrice" class="text-danger"></span>
</div>
</div>
</div>
<div class="col-md-4">
<div class="row m-1">
<label asp-for="OverallDiscountBasic" class="col-sm-5 col-form-label">Gesamtnachlass auf Basisfahrzeug (%)</label>
<div class="col-sm-4">
<input asp-for="OverallDiscountBasic" class="form-control float-right" />
<span asp-validation-for="OverallDiscountBasic" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label class="col-sm-5 col-form-label">Gesamtnachlass auf Listenpreis (%)</label>
<div class="col-sm-4">
<input asp-for="OverallDiscountList" class="form-control float-right" />
<span asp-validation-for="OverallDiscountList" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label class="col-sm-5 col-form-label">Gesamtnachlass inkl. Händleroptionen (%)</label>
<div class="col-sm-4">
<input asp-for="OverallDealerDiscount" class="form-control float-right" />
<span asp-validation-for="OverallDealerDiscount" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label asp-for="RetailPrice" class="col-sm-5 col-form-label">Überbewertung Wholesale (€)</label>
<div class="col-sm-4">
<input asp-for="OvervaluationWholeSale" class="form-control float-right" />
<span asp-validation-for="OvervaluationWholeSale" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label asp-for="Listprice" class="col-sm-5 col-form-label">Überbewertung Merbag (€)</label>
<div class="col-sm-4">
<input asp-for="OvervaluationMerbag" class="form-control float-right" />
<span asp-validation-for="OvervaluationMerbag" class="text-danger"></span>
</div>
</div>
</div>
<div class="col-md-4">
<div class="row m-1">
<label asp-for="DealerDiscountList" class="col-sm-5 col-form-label">Dealer Discount Basisfahrzeug (%)</label>
<div class="col-sm-4">
<input asp-for="DealerDiscountBasic" class="form-control float-right" />
<span asp-validation-for="DealerDiscountBasic" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label class="col-sm-5 col-form-label">Dealer Discount Listenpreis (%)</label>
<div class="col-sm-4">
<input asp-for="DealerDiscountList" class="form-control float-right" />
<span asp-validation-for="DealerDiscountList" class="text-danger"></span>
</div>
</div>
<div class="row m-1">
<label class="col-sm-5 col-form-label">Verbleibende Marge (€)</label>
<div class="col-sm-4">
<input asp-for="Margin" class="form-control float-right" />
<span asp-validation-for="Margin" class="text-danger"></span>
</div>
</div>
</div>
</div>
</form>
解决方案
推荐阅读
- python - 将值块添加到 PyTorch 中特定位置的张量
- react-native - 反应,“e”是做什么的?
- python - OSMNX 无法从某个地方导入图形或 GDF
- php - 如何在function.php文件中的Wordpress上的Woocommerce购物车页面上为折扣文本添加换行符
- mysql - 当列为 unix 格式时,在两个日期之间拉取行
- bash - 为什么我在一个简单的 shell 脚本中得到“expr: syntax error”的错误
- gitlab - 工件是否必须上传到 gitlab 才能在阶段之间重用?
- azure - 如何使用 Powershell Get-Azvm 获取 Azure 中 VM 列表的状态
- ruby-on-rails - 帽子流产了!SSHKit::Runner::ExecuteError:在主机 xxx.xxx.xx.xx 上执行时出现异常:部署程序
- javascript - JS调用的Flask多个变量