JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.1.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/bootstrap.min.js"></script>
<body>
    <div class="container-fluid body-content">       
          <div class="mt-alerts">
                <div class="alert alert-danger alert-dismissible" role="alert">
                    <button class="close" aria-label="Close" type="button" data-dismiss="alert">
                        <span aria-hidden="true">×</span>
                    </button>
                    Something bad happened!
                </div>
               <div class="alert alert-success alert-dismissible" role="alert">
                   <button class="close" aria-label="Close" type="button" data-dismiss="alert">
                       <span aria-hidden="true">×</span>
                   </button>
                   Previous document saved successfully!
               </div>
          </div>
          <div class="row">
                <div class="col-md-12 mt-form-panel">
                    <span>This is content div</span>
                    <form>    
                        <span>Something goes here</span>                            
                    </form>
                </div>    
         </div>
  </div>
 </body>

CSS

.mt-alerts {
    position:fixed;
}

.mt-form-panel {
    background-color: lightgray;
    height:500px;    
    width:200px;
 }