JSFiddle - React, Tailwind, and code Playground

by J. Albert Bowden

HTML

<div class="top">
        <div class="header title">Some Big Header Goes Here</div>
        <div class="sub-header title">The fancyness enters here.</div>
        <a href="#">A random link</a>
</div>

CSS

.header {
        padding:2%;
}
.sub-header {
        font-size:120%;
        font-style:italic;
}
.title {
        font-size:158%;
        line-height:80%;
}
.top {  
        display:block;
        text-align:center;
        border:1px solid lime;
        padding:1%;
}
.top a {
       /*color:red;*/ /* This works but I don't want this */
      /** padding:100000px;**/ /* This does not work, nor do smaller values */
      /** margin:-999999px; **/ /* This does nothing. */
    display:block;
    margin:25px; padding:5px;
}