JSFiddle - React, Tailwind, and code Playground

HTML

<div class="section2">
    	<div class="referencesPics"> 
        	<div class="line1">
            	<div class="leftPic">
                hi
                </div>
                <div class="rightPic">
                hallo
                </div>
			</div>
         </div>        
	</div>

CSS

.section2 {
	height:100%;
}

.section2 .referencesPics {
	height:25%;
}

.section2 .referencesPics .line1 {
	height:100%;
	background-color:blue;
	display: inline-block; *display: inline; zoom: 1; vertical-align: top;
}

.section2 .referencesPics .line1 .leftPic {
	height:100%;
	width:75%;
	background-color:green;
	display: inline-block; *display: inline; zoom: 1; vertical-align: top;
}

.section2 .referencesPics .line1 .rightPic {
	height:100%;
	width:25%;
	background-color:yellow;
display: inline-block; *display: inline; zoom: 1; vertical-align: top;
}

.section2 .referencesPics .line2 {
	height:100%;
	background-color:yellow;
}

.section2 .referencesPics .line3 {
	height:100%;
	background-color:brown;
}

.section2 .referencesPics .line4 {
	height:100%;
	background-color:green;
}