JSFiddle - React, Tailwind, and code Playground

by Mike Gifford

HTML

<ul>
    <li><a href="http://drupal.org/">Drupal.org</a>

    </li>
    <li><a href="http://ox.ca/">Link 2</a>

    </li>
    <li><a href="http://openconcept.ca/">OpenConcept</a>

    </li>
    <li><a href="http://ox.ca/4">Link 4</a>

    </li>
    <li><a href="http://ox.ca/5">Link 5</a>

    </li>
    <li><a href="http://ox.ca/6">Link 6</a>

    </li>
    <li>No Link</li>
    <li><a href="http://ox.ca/6">Link 8</a>

    </li>
</ul>

CSS

body {
    border: 0 none;
    font-size: 87.5%;
    line-height: 1.5;
    margin: 0;
    outline: 0 none;
    padding: 0;
    word-wrap: break-word;
}
a:link, a:visited {
    color: #0071b3;
}
a:hover, a:focus, a:active {
    color: #004b77;
    background-color:rgba(0, 113, 179, 0.2);
}
a:link, a:visited {
    text-decoration: none;
    border-bottom: 1px solid #c6d6e4;
    padding: .2em;
}
a:hover, a:active, a:focus {
    text-decoration: none;
    border-bottom: none;
    text-shadow: 1px 1px 2px #fff;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    padding: .2em;
}
a.feed-icon {
    display: inline-block;
    padding: 15px 0 0 0;
    border-bottom: none;
}