JSFiddle - React, Tailwind, and code Playground
HTML
<div class="container">
<div class="row">
<div class="col-md-4">
<div class="innertext">Text Test Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text</div>
</div>
</div>
</div>
CSS
@import url('http://getbootstrap.com/dist/css/bootstrap.min.css');
h4 {
margin-top: 25px;
}
.row {
margin-bottom: 20px;
}
.row .row {
margin-top: 10px;
margin-bottom: 0;
}
[class*="col-"] {
padding-top: 15px;
padding-bottom: 15px;
background-color: #eee;
background-color: rgba(86, 61, 124, .15);
border: 1px solid #ddd;
border: 1px solid rgba(86, 61, 124, .2);
height: 250px;
}
.innertext {
position: relative;
top: 50%;
transform: translateY(-50%);
}