JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
	<head>
		<title>World War Web</title>
<style>
body,html {
	margin:0;
	padding:0;
}
#wrap {
	text-align:center;
}
#left {
	width:30%;
	height:700px;
	display:inline-block;
}
#right {
	width:65%;
	height:700px;
	display:inline-block;
	text-align:center;
}
#right img {
	position:relative;
	padding:0;
	margin:0;
	display:block;
	width:50%;
}
#right, #left {
	border:2px solid #0099FF;
	border-radius:1em;
}
tr {
	width:50%;
}
td {
	padding:1em;
	border: 1px solid black;
}
</style>
	</head>
	<body>
	<div id='wrap'>
		<div id='left'>
		<p>Country 1</p>
		<table>
			<tr>
				<td>Economy</td><td>Military</td>
			</tr>
			<tr>
				<td>Money</td><td>Standby:</td>
			</tr>
			<tr>
				<td></td><td>Defense:</td>
			</tr>
			<tr>
				<td>Level:</td><td>Level:</td>
			</tr>
		</table>
		</div>
		<div id='right'>
			<img src="WWII.jpg" />
		</div>
	</div>
	</body>
</html>