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.
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
Post a Comment