如何显示在同一行居中的按钮?

时间:2018-12-04 18:29:54

标签: html css bootstrap-4

我想在行中央显示一个按钮,在同一行上将文本向左对齐:

<div *ngFor="let card of partNumberPlanningCards; let i = index" class="partnumber-basic-card">
    <div *ngFor="let scope of containerScopeLineItems" #lineItem [title]="getOperatingWeightBy(scope.containerScopeId, card.typeId)">

        {{lineItem.title}}

    </div>
</div>

问题是我得到了以下结果:https://jsfiddle.net/DTcHh/96757/

1 个答案:

答案 0 :(得分:1)

Bootstrap有很多课程可以玩。

可能的解决方案之一:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">

<div class="container-fluid card-header btn-group">
  <h4 class="card-title">set</h4>
  <div class="text-center container">
    <button type="button" class="btn btn-primary center-block add-option" id="add-option">test</button>
  </div>
</div>