JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div class="container">
<div class="row">
<div class="col-sm-4">
<img src="image/logo.png">
</div>
</div>
</div>
<div class="container" id="student">
<div class="row">
<div class="col-sm-4">
<h1>Student</h1>
</div>
<div class="col-sm-offset-2 col-sm-6" id="date">
<form class="form-inline">
<div class="form-group">
<label for="focusedInput"> <b>Date:</b></label>
<input class="form-control" id="focusedInput" type="text" placeholder="DD Month Year">
</div>
</form>
</div>
</div>
</div>
CSS
@font-face {
font-family: "myfont";
src: url("../fonts/opensans/OpenSans-Regular 2.ttf");
}
body{
font-family: "myfont";
}
img{
width: 150px;
}
#student{
margin-top: 50px;
}
#date{
background: black;
margin-top: 20px;
color: white;
padding: 10px;
}