JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<ul id="items">
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 01</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 02</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 03</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 04</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 05</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 06</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 07</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 08</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 09</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 10</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 11</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 12</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 13</button></li>
					<li><button class="btn btn-default"><i class="fa fa-long-arrow-right"></i> Item 14</button></li>
				</ul>

SCSS

ul#items{
  list-style:none;
  -webkit-column-count: 3;
  -moz-column-count: 3;
  column-count: 3;
  li{
    margin:5px 0;
    button{
      background:lightgrey;
      color:black;
      border:0;
      overflow:hidden;
      padding:10px 15px;
      position:relative;
      -webkit-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out;
      .fa{
        position:absolute;
        left:-30px;
        top:50%;
        color:white;
        -ms-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        -webkit-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
      }
      &:hover{
        background:DeepPink;
        color:white;
        padding-left:40px;
        .fa{
          left:15px;
        }
      }
    }
  }
}