JSFiddle - React, Tailwind, and code Playground

by Lalji Tadhani

HTML

<script src="https://code.jquery.com/jquery-3.4.1.slim.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css">
<section class="sec1 container-fluid mt-3 pd-5 ">
  <h2 class="mt-5">Newsletter</h2>
  <p>Subscribe to this news letter to get the latest news about us</p>
    <form class="form-inline mt-2" action="/actionPage.php">
      
        <input type="email" class="form-control" id="email" placeholder="Enter email">
      
      <button type="submit" class="btn btn-dark btn-sm">submit</button>
    </form>
</section>

CSS

.sec1{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
background: #faf8fb;}