JSFiddle - React, Tailwind, and code Playground

HTML

<span class="notification" id="success-notification">Registration complete. Please check your mail.</span>
<span class="notification" id="alert-notification">Account already activated.</span>
<span class="notification" id="information-notification">Please check you email.</span>
<span class="notification" id="error-notification">Wrong login detials.</span>

CSS

.notification {
	padding: 15px;
	margin-bottom: 20px;	
	border: 1px solid #eed3d7;
	border-radius: 4px;
	position: absolute;
	bottom: 0px;
	right: 21px;
	float: right; 
	clear: right;
	diplay: block;
}
#success
{
  color: white;
  background-color: #37BC9B;
}

#alert-notification
{
  color: white;
  background-color: #DA4453;
}

#success-notification
{
  color: white;
  background-color: #37BC9B;
}
#information-notification {
  color: white;
  background-color: #4A89DC;
}
#error-notification {
  color: white;
  background-color: #DA4453;
}