JSFiddle - React, Tailwind, and code Playground
HTML
<div class="column-xs-1 column-sm-2 column-md-3 column-lg-2">
Collaboratively administrate empowered markets via plug-and-play networks. Dynamically procrastinate B2C users after installed base benefits. Dramatically visualize customer directed convergence without revolutionary ROI.
css3 </div>
<div class="column-xs-1 column-sm-2 column-md-3 column-lg-2">
Collaboratively administrate empowered markets via plug-and-play networks. Dynamically procrastinate B2C users after installed base benefits. Dramatically visualize customer directed convergence without revolutionary ROI.
css3 </div>
CSS
@media (max-width: 768px) {
.column-xs-1 {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
padding: 0 15px 0 15px;
-webkit-columns: auto 1;
-moz-columns: auto 1;
columns: auto 1; }
.column-xs-2 {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
padding: 0 15px 0 15px;
-webkit-columns: auto 2;
-moz-columns: auto 2;
columns: auto 2; }
.column-xs-3 {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
padding: 0 15px 0 15px;
-webkit-columns: auto 3;
-moz-columns: auto 3;
columns: auto 3; }
.column-xs-4 {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
padding: 0 15px 0 15px;
-webkit-columns: auto 4;
-moz-columns: auto 4;
columns: auto 4; }
.column-xs-5 {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
padding: 0 15px 0 15px;
-webkit-columns: auto 5;
-moz-columns: auto 5;
columns: auto 5; }
.column-xs-6 {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
padding: 0 15px 0 15px;
-webkit-columns: auto 6;
-moz-columns: auto 6;
columns: auto 6; }
.column-xs-7 {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
padding: 0 15px 0 15px;
-webkit-columns: auto 7;
-moz-columns: auto 7;
columns: auto 7; }
.column-xs-8 {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
padding: 0 15px 0 15px;
-webkit-columns: auto 8;
-moz-columns: auto 8;
columns: auto 8; }
.column-xs-9 {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
padding: 0 15px 0 15px;
-webkit-columns: auto 9;
-moz-columns: auto 9;
columns: auto 9; }
.column-xs-10 {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
padding: 0 15px 0 15px;
...