JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<div class="container">
<div class="header text-info">
		<h1>Heading</h1><br />
		<h2>Acc. Type</h2><br />
		<h3>Month</h3>
	</div>
<legend>Income</legend>
	<div class="acc-content row">
		<div class="col-md-12">
			<b>col-md-12</b>
			<span class="pull-right">#@#</span>
		</div>
	</div>
<legend>Expense</legend>
	<div class="acc-content row">
		<div class="col-md-12">
			<b>col-md-12</b>
			<span class="pull-right">#@#</span>
		</div><!-- /col-md-12 -->
		<div class="col-md-10 col-md-offset-1">
			<b>col-md-10</b>
			<span class="pull-right">#@#</span>
		</div><!-- /col-md-10 -->
		<div class="col-md-8 col-md-offset-2">
			<b>col-md-8</b>
			<span class="pull-right">#@#</span>
		</div><!-- /col-md-8 -->
	</div><!-- /acc-content -->
</div>

CSS

.header{
		border-bottom:solid 1px #eee;
		margin-top:30px;
		text-align:center;
	}
	.header h1{
		display:inline;
		font-size:25px;
	}
	.header h2{
		display:inline;
		font-size:20px;
	}
	.header h3{
		display:inline;
		font-size:15px;
	}
	.acc-content{
		margin:0px auto !important;		
		width:100%;
	}
	.acc-content div[class*='col-md-']{
		border:solid 1px red;
		display:block;
		margin-top: 5px;
        margin-bottom: 5px;
	}