javascript - Dynamically adjust Bootstrap layout -
i have kind of problem. implement similar this:
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div class="container"> <div class="row"> <div class="col-xs-12"> <div class="col-xs-3">test 1</div> <div class="col-xs-3">test 2</div> <div class="col-xs-3" ng-if="test">test 3</div> </div> </div> <div class="row"> <div class="col-xs-12"> <div class="col-xs-3">test 4</div> <div class="col-xs-3">test 5</div> <div class="col-xs-3">test 6</div> </div> </div> </div> how can in simple way realize, once disable "test 3" div testthe "test 4" div takes it's place? real code more complicated, needs dynamically float left no white space gets created.
put of col-* in single row..
<div class="container"> <div class="row"> <div class="col-xs-3">test 1</div> <div class="col-xs-3">test 2</div> <div class="col-xs-3" ng-if="test">test 3</div> <div class="col-xs-3">test 4</div> <div class="col-xs-3">test 5</div> <div class="col-xs-3">test 6</div> </div> </div> this known bootstrap column wrapping.
Comments
Post a Comment