JSFiddle - React, Tailwind, and code Playground

by swfour

HTML

<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed imperdiet ullamcorper mi sed pulvinar. Integer ac pretium erat, eu pulvinar felis. Nullam rutrum, ante id viverra posuere, enim justo tempus nunc, eu ultrices lectus risus eu ante. In mauris nulla, suscipit vel est vitae, eleifend lobortis diam. Ut lacinia mattis rhoncus. Sed tempus tempor eros vitae egestas. Quisque eu purus vel turpis porta laoreet. Mauris ac risus a quam auctor sodales eget quis odio. Vestibulum mollis feugiat nisl nec rhoncus. Praesent vel gravida velit. Cras at tortor aliquam, tincidunt sapien non, viverra lacus. In porttitor viverra lacus id gravida. Aliquam ultrices augue et lorem placerat, quis vestibulum ante consequat. In facilisis, quam a congue commodo, orci nibh blandit lorem, vitae semper neque elit in libero. Donec adipiscing ligula augue, vitae cursus tellus vulputate ac. Maecenas tellus erat, venenatis sit amet molestie in, ullamcorper sit amet tortor. Maecenas eget metus aliquam, feugiat lacus quis, imperdiet velit. In hac habitasse platea dictumst. Nam sed dignissim lorem. Phasellus sed lacus urna. Suspendisse ultrices arcu lorem, non malesuada dolor rutrum vel. Praesent pretium, ligula vel fringilla pretium, odio orci volutpat neque, vitae suscipit metus turpis eu neque. Cras dapibus odio eget tellus placerat, nec rutrum mauris dapibus. Donec fermentum mi tristique feugiat dignissim. Proin mollis tellus egestas, viverra elit vitae, volutpat massa. Maecenas eleifend pretium dolor vitae lobortis. Nullam gravida est eget velit luctus, in tincidunt risus feugiat. Aliquam blandit rutrum erat, non consequat diam tempus non. Nullam ante libero, pharetra gravida lectus vel, sagittis lobortis quam. Aliquam sit amet sem at nisl commodo pulvinar in non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Duis nec dignissim leo. In condimentum porta elit. Suspendisse sit amet lacus enim. Suspendisse potenti. Duis nec sodales mauris,...

CSS

html, body {
    width:100%;
}
@media screen and (min-width: 1024px){
    div {
        -webkit-column-width: 20em;
        -webkit-column-gap: 2em;
        -webkit-column-rule: 1px solid #eee;
        -webkit-column-count: 2;
        -moz-column-width: 20em;
        -moz-column-gap: 2em;
        -moz-column-rule: 1px solid #eee;
        -moz-column-count: 2;
        -ms-column-width: 20em;
        -ms-column-gap: 2em;
        -ms-column-rule: 1px solid #eee;
        -ms-column-count: 2;
        column-width: 20em;
        column-gap: 2em;
        column-rule: 1px solid #eee;
        column-count: 2;
    }
}