JSFiddle - React, Tailwind, and code Playground
HTML
<div class="Footer">
<input id="SaveButton" type="button" value="Save">
<input id="SubmitButton" type="button" value="Submit">
<a class="Button" href="/">Reset</a>
</div>
CSS
.Footer
{
/*padding:5px;
margin:0px;*/
border-top:1px solid #557AB5;
font-style:italic;
}
.Footer input[type=button],
.Footer input[type=submit],
.Footer .Button
{
float:right;
font-style:normal;
line-height: 16px;
padding: 3px 7px;
}
input[type="button"],
input[type="submit"],
.Button
{
background: none repeat scroll 0 0 #EEEEFF;
border: 1px solid #414649;
color: #002570;
cursor: pointer;
font-size:12px;
font-weight: bold;
letter-spacing: 0.05em;
margin: 0 2px;
padding: 3px 7px;
text-shadow: 1px 1px 1px #DCECF6;
-moz-border-radius: 12px 12px 12px 12px;
-webkit-border-radius: 12px 12px 12px 12px;
line-height: 16px;
}
input[type="button"]:hover,
input[type="submit"]:hover,
.Button:hover
{
border: 2px solid #414649;
padding:2px 6px;
text-shadow: 1px 1px 0.0px #DCECF6;
}
input[type="button"]:disabled,
input[type="submit"]:disabled,
.Button:disabled
{
background-color:#F4F4F4;
color:#87908E;
border: 2px solid #BCC0C2;
cursor:auto;
padding:2px 6px;
}