Flex

by Hemant Sharma

HTML

<div class="container">
  <div class="col">Col 1</div>
  <div class="col">Col 2</div>
  <div class="col">Col 3</div>
  <div class="col">Col 4</div>
  <div class="col">Col 5</div>
  <div class="col">Col 6</div>
</div>

SCSS

.container{
  background: Dodgerblue;
  display: flex;
  flex-wrap: wrap; //nowrap|wrap|wrap-reverse|initial|inherit;
  flex-direction: row; //row|row-reverse|column|column-reverse|initial|inherit;
  div{
    margin: 20px;
    padding: 20px;
    //width: 50px;
    background: #f1f1f1;
    border-radius: 5px;
    box-shadow: 5px 10px 18px orangered;
    //flex: 1 0 15%;
  }
}