如何将进度条和按钮与引导程序对齐

Question

我尝试了不同的选择，但我似乎无法对其进行排序。有什么想法吗？

$scope.secondGraphCtrl = function() {
        if($scope.secondGraph==true)
            $scope.secondGraph=false;
        else
            $scope.secondGraph=true;
    }

Answer 1

对于您的代码，只需将<div class="row"> <div class="col-md-6"> <div class="row"> <div class="progress col-md-10"> <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="55%" aria-valuemin="0" aria-valuemax="100" style="width:55%"> 55%<span class="sr-only">55% Complete</span> </div> </div> <button style="margin-left: 20px; float:right;" type="button" class="btn-sm btn-danger">DANGER</button> </div> </div> <div class="col-md-6">.col-md-4</div> </div> 添加到进度条即可。但我不推荐你目前的结构。无需创建嵌套行。

{{1}}

<强>输出：

CodePly

Answer 2

不确定你是如何排队的，但我认为这更像是你想要的

<div class="row">
  <div class="col-sm-6">
      <div class="row">
           <div class="col-sm-8">
                PROGRESS BAR GOES HERE
           </div>
           <div class="col-sm-4">
                BUTTON GOES HERE
           </div>
       </div>
   </div>
   <div class="col-sm-6">
        NOT SURE WHY YOU HAVE COL-MD-4 HERE BUT IF YOU WANT THAT DISPLAYED IT GOES HERE
   </div>