JSFiddle - React, Tailwind, and code Playground

HTML

<div id="info-block">
	<div id="twaewsit-content">
		<span class="header">This Week @ EWSIT</span>
	</div>
	<div id="ue-content">
		<span class="header">Upcoming Events</span>
	</div>
	<div id="twit-content" style="border:none !important;">
		<a class="twitter-timeline" href="https://twitter.com/EWSITGOGREEN" data-widget-id="362066477261680640">Tweets by @EWSITGOGREEN</a>
		<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
	</div>			
</div>

CSS

#info-block {
	padding:20px 0 20px 0;
	width:100%;
	text-align:center;
}

#info-block > div {	
	height:250px;
	width:30%;
	max-height:250px;
	overflow-y:hidden;
	display:inline-block !important;
    vertical-align: bottom;
	border:1px solid #e8e8e8;
	
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	
	font:normal normal normal 12px/16px "Helvetica Neue",Arial,sans-serif;
}

#info-block > div > .header {
	display:block;
	padding:8px;
	font-weight:bold;
	font-size:14px;
	text-align:left;
	border-bottom-style:solid;
	border-bottom-color:#e8e8e8;
	border-bottom-width:1px;
}