Bootstrap: show/hide column divs with checkbox and change column span
- by Berto Alvaro
I'm using Bootstrap 3.2. I'm trying to figure out if there's a way to show/hide a "col-sz-#" div AND change the "col-sz-#" class in visible divs to resize them to fit the container using checkbox style buttons for each column.
For example, if I start with
<div class="row">
<div class="col-md-2">...</div>
<div class="col-md-2">...</div>
<div class="col-md-2">...</div>
<div class="col-md-2">...</div>
<div class="col-md-2">...</div>
<div class="col-md-2">...</div>
</div>
Then if hide 2 of them and the others resize:
<div class="row">
<div class="col-md-2 hidden">...</div>
<div class="col-md-2 hidden">...</div>
<div class="col-md-3">...</div>
<div class="col-md-3">...</div>
<div class="col-md-3">...</div>
<div class="col-md-3">...</div>
</div>
if the total columns can't divide 12 evenly like 5, then it wouldn't change.