JSFiddle - React, Tailwind, and code Playground

by Dedi Wibisono

HTML

<div class="login-body">
   <div class="container h100">
      <div class="row align-items-center h-100">
         <div class="col-d-4 my-auto mx-auto">
            <div class="text-center">
               <img src="/img/perma-xsm.png" alt="">
            </div>
            <div class="login-box">
               <div class="login-title">LCM</div>
               <form class="form-signin" id="loginForm" action="/login" method="post">
                  <input type="text" name="username" id="username" class="form-control" placeholder="Email" required="" autofocus="">
                  <input type="password" name="password" id="password" class="form-control" placeholder="Password" required="">
                  <button class="btn btn-lg btn-primary btn-block" type="submit">Login</button>
               </form>
            </div>
         </div>
      </div>
   </div>
</div>

CSS

html{
    height:100%;
    background-color:#fff;
    font-size:12px;
}
.login-body{
    height:100%;
    background-color:#fff;
    padding-top:20px;
}