html - How to display items side by side until window width then in next row -


i have list of items in angularjs scope variable. want display them in browser screen side side upto window width, in next row. this.

enter image description here

i want padding of 5px; sides between 2 items.

how using bootstrap/css. bootstrap preferred.

you can giving these items display: inline-block; , padding: 5px; keep gap want.

here's code need:

.box {      padding : 5px;      display : inline-block;      min-width: 100px;      min-height: 50px;      background-color: red;          }
        <div class="box"></div>      <div class="box"></div>      <div class="box"></div>      <div class="box"></div>      <div class="box"></div>      <div class="box"></div>

you can resize window see difference , how behave dynamically.

resize result window in demo fiddle best results.


Comments

Popular posts from this blog

javascript - AngularJS custom datepicker directive -

javascript - jQuery date picker - Disable dates after the selection from the first date picker -