JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box quarter">
    <h1>FIRST BOX</h1>
    <h2>Alignment works fine if this text is removed.</h2>
</div>

<div class="box quarter">
    <h1>SECOND BOX</h1>
</div>

CSS

@import url(http://fonts.googleapis.com/css?family=Montserrat);

body {
	background: #D6D6D6;
	margin: 60px 40px;
}

.box {
	display: inline-block;
	margin: 10px;
	position: relative;
    border-radius: 4px;
	box-shadow: 1px 1px 1px 1px #CCC;
	font-family: 'Montserrat', sans-serif;
	padding: 0px 10px 15px 10px;
}

.quarter {
	width: 380px;
	height: 425px;
	background: #FFF;
}