JSFiddle - React, Tailwind, and code Playground

by DelphinPRO

HTML

<div class="section">
	<div class="container">
		<div class="left">
			Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reprehenderit vitae ex rem quae quis id itaque nulla doloremque voluptatibus voluptates quasi mollitia consequuntur, vero et nam fugit laborum. Vitae, deserunt!
		</div>
		<div class="right">
			Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iste, id, inventore? Architecto tempore accusantium, laudantium enim doloribus atque sint amet eveniet, obcaecati maiores quos voluptas doloremque voluptates aspernatur itaque ut!
		</div>
	</div>
</div>

CSS

.section {
  background: linear-gradient(to right, #EEA611, #EEA611 50%, #012100 50%, #012100);
  color: #fff;
}

.container {
  width: 80%;
  margin: auto;
  display: flex;
	outline: 1px dotted red;
	outline-offset: -1px;
}

.left {
  width: 40%;
  background: #EEA611;
	padding: 1em;
}

.right {
  width: 60%;
  background: #012100;
	padding: 1em;
}