I want to always pull the last column to the right. I have 1 4-column group, 1 7 -column group and a single column.
My content is visible only on specific occasions. In the event that the content in the col-md-7 is there, the last one gets pulled on the right fine. When it isn't there, it goes to the middle.
I am using AngularJS, along with bootstrap 3.
HTML Code:
<div class="row mr10 ml10">
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
<button class="btn btn-default btn-sm"
ng-click="getData(data, LCtrl.Protection);"
ng-disabled="LCtrl.loading">
Run Query
</button>
<button class="btn btn-danger btn-sm" ng-if='LCtrl.loading'
ng-click="LCtrl.DataStop('Stoped By User')">
Stop Query
</button>
</div>
<div class="col-lg-7 col-md-7 col-sm-7 col-xs-7"
permission="[lCtrl.roles.disabled]">
<div class="pull-right mr10">
<span class="mb10"><b>Protection</b></span>
<label class="switch" style="margin-top: 6px; margin-bottom: -6px;">
<input type="checkbox"
ng-model="LCtrl.Protection"
ng-change="changeProtection()">
<span class="slider round"></span>
</label>
</div>
</div>
<div class="col-lg-1 col-md-1 col-sm-1 col-xs-1">
<a href="//l-l/l.html?l={{lCtrl.licenseStr}}"
class="linkAtHeader pull-right"
style="position: fixed;"
target="_blank">
<i class="fa fa-question-circle" aria-hidden="true"></i>
Help
</a>
</div>
use this code for col-md-1 style={float:right;}