JSFiddle - React, Tailwind, and code Playground
HTML
<div class="head">
<header>
<h1>Task</h1>
</header>
</div>
<div class="signup">
<h2>Register</h2>
<form action="#">
<ul>
<li><label><strong>First Name</strong><input type="text" name="fname" /></label></li>
<li><label><strong>Last Name</strong><input type="text" name="lname" /></label></li>
<li><label><strong>email</strong><input type="text" name="email" /></label></li>
<li><label><strong>Password</strong><input type="password" name="pwd"/></label></li>
<li><label><strong>Confirm Password</strong><input type="password" name="cpwd"/></label></li>
<li><label><strong>Comments</strong></label><textarea name="comment" cols="30" rows="10"></textarea></li>
<li><input type="submit" value="Sign Up" /></li>
</ul>
</form>
</div>
<div class="foot">
<footer>
<p>Task</p>
</footer>
</div>
CSS
html,
body {
margin:0;
padding:0;
}
.wrap
{
position:relative;
}
.head
{
border:1px solid black;
height:50px;
}
.foot {
background:#ffab62;
right:0;
position:absolute;
bottom:0;
left:0;
}