html - Bootstrap item order in multi-column item group -


i'm trying change order of buttons in bootstrap list-group. have following layout (row first).

enter image description here

i'm trying achieve column first layout, so.

enter image description here

i'm re-sorting list make happen, i'm wondering if there more elegant approach solve problem.

https://www.bootply.com/pfslgefurq

i don't know if it's more elegant add css:

.list-group {     -webkit-column-count: 3; /* chrome, safari, opera */     -moz-column-count: 3; /* firefox */     column-count: 3;      -webkit-column-gap: 0; /* chrome, safari, opera */     -moz-column-gap: 0; /* firefox */     column-gap: 0; } 

then make each bootstrap column col-md-12 so:

<ul class="list-group">     <button class="btn col-md-12">row1</button>     <button class="btn col-md-12">row2</button>     <button class="btn col-md-12">row3</button>     <button class="btn col-md-12">row4</button>     <button class="btn col-md-12">row5</button>     <button class="btn col-md-12">row6</button> </ul> 

i same result. see here on bootply.


Comments

Popular posts from this blog

python Tkinter Capturing keyboard events save as one single string -

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

javascript - Z-index in d3.js -