JSFiddle - React, Tailwind, and code Playground

by htmlzengarden

HTML

<div>
    <img src="http://dummyimage.com/100&amp;text=1" alt="1" />
    <img src="http://dummyimage.com/100&amp;text=2" alt="2" />
    <img src="http://dummyimage.com/100&amp;text=3" alt="3" />
    <img src="http://dummyimage.com/100&amp;text=4" alt="4" />
    <img src="http://dummyimage.com/100&amp;text=5" alt="5" />
    <img src="http://dummyimage.com/100&amp;text=6" alt="6" />
    <!--
    <img src="http://dummyimage.com/100&amp;text=7" alt="7" />
    <img src="http://dummyimage.com/100&amp;text=8" alt="8" />
    -->
</div>

CSS

img
{
    display: block;
}
div
{
    -webkit-column-count: 2;
       -moz-column-count: 2;
        -ms-column-count: 2;
         -o-column-count: 2;
            column-count: 2;
      -webkit-column-gap: 0;
         -moz-column-gap: 0;
          -ms-column-gap: 0;
           -o-column-gap: 0;
              column-gap: 0;
    width: 200px;
    height: 400px;
    direction: rtl;
}