JSFiddle - React, Tailwind, and code Playground

by Shishir Max

HTML

<div><a href="#" class="button">do thing</a></div>

<section id="content">
    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada <a href="#">fames ac</a> turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero <a href="#" class="button">sit amet</a> quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
</section>

<aside>
<ul class="fancylist">
    <li><a href="#">Lorem ipsum</a> dolor sit amet, consectetuer adipiscing elit.</li>
    <li>Aliquam tincidunt <a href="#" class="button">mauris</a> eu risus.</li>
   <li>Vestibulum auctor dapibus neque.</li>
</ul>
</aside>

CSS

p, ul, div { margin: 20px 0; font: 14px/2 Georgia, Serif; }

.button {
    background: #666;
    color: white;
    padding: 2px 6px 4px;
    margin: 0 2px;
    -webkit-border-radius: 8px;
    -moz-border-radius:    8px;
    border-rardius:        8px;
    text-decoration: none;
}

#content a { color: blue; border-bottom: 1px dotted currentColor; text-decoration: none; }

aside ul.fancylist li a { color: red; }