JSFiddle - React, Tailwind, and code Playground

by mraranturnik

HTML

<section class="content list_page">
    <article id="post-66">
        <div class="list_img">
            <img src="http://lorempixel.com/400/200/" />
        </div>
        <div class="list_text">Content 1</div>
    </article>
    <article id="post-63">
        <div class="list_img">
            <img src="http://lorempixel.com/400/200/sports/" />
        </div>
        <div class="list_text">Content 2</div>
    </article>
 
</section >

CSS

article {
   overflow: hidden;
    display:  block;
}

article:nth-child(odd) .list_img{ 
    float:right; 
}
article:nth-child(even) .list_img{
     float:left;
}