JSFiddle - React, Tailwind, and code Playground

HTML

<section id="timeline">
    <article>
        <div class="container">
            <div class="year">
                <h3>1981</h3>
            </div>
            <div class="inner">
                <div class="row">
                    <div class="timeline-img col-sm-4">
                        <img src="images/history.jpg">
                    </div>
                    <div class="timeline-content col-sm-8">
                        	<h4>The Dream</h4>

                        <p>asdfasdfasdfasd</p>
                    </div>
                </div>
            </div>
        </div>
    </article>
    <article>
        <div class="container">
            <div class="year">
                <h3>1981</h3>
            </div>
            <div class="inner">
                <div class="row">
                    <div class="timeline-img col-sm-4">
                        <img src="images/history.jpg">
                    </div>
                    <div class="timeline-content col-sm-8">
                        	<h4>The Dream</h4>

                        <p>asdfasdfasdfasd</p>
                    </div>
                </div>
            </div>
        </div>
    </article>
    <article>
        <div class="container">
            <div class="year">
                <h3>1981</h3>
            </div>
            <div class="inner">
                <div class="row">
                    <div class="timeline-img col-sm-4">
                        <img src="images/history.jpg">
                    </div>
                    <div class="timeline-content col-sm-8">
                        	<h4>The Dream</h4>

                        <p>asdfasdfasdfasd</p>
                    </div>
                </div>
            </div>
        </div>
    </article>
    <article>
        <div class="container">
            <div class="year">
                <h3>1981</h3>
            </div>
            <div class="inner">
                <div class="row">
                    <div...

CSS

#timeline {padding:0;position:relative}

#timeline article:after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    height: 100%;
    width: 1px;
    background: #222;
	z-index:1;
}

#timeline article:last-child:after {background:none}


/* ------ */

#timeline article .container {position:relative;z-index:10}

#timeline article {background:#ededed;}

#timeline article:nth-child(3n-1) {background:#bed8e7}

#timeline article:nth-child(3n-0) {background:#d4ceac}