JSFiddle - React, Tailwind, and code Playground

Border tinkerings

by Jennifer Perrin

HTML

<h1><a href="">Link</a></h1>

<h2><span>Not a Link</span></h2>

CSS

h1,a{
    color:#f43059;
    border:1px dotted #f43059;
}
h1,h2{
    font-family:"Helvetica Neue", Arial;
    margin-bottom:24px;
    text-align:center;
}
h1{
    border-width:1px 0;
    padding:0 10px;
}
a{
    text-decoration:none;
    display:block;
    border-width:0 1px;
    padding:20px 10px;
    margin:-10px 0;
}

h2{
    color:#f43059;
    border:5px solid #f43059;
    padding:10px;
}
h2 span{
    display:block;
    margin:0 -15px;
    background:#fff;
}