JSFiddle - React, Tailwind, and code Playground

by Fernando De Leon

HTML

<div class="my_content_container">
    <a href="/my/link/location/">Go to my link location</a>
</div>

<a href="http://www.google.com/">
   <button>Visit Google</button>
</a>


<a href="https://www.google.com/" class='my_content_container'>
 text
</a>

<a href="something" class="button1">Button</a>
<a href="something" class="button1">Another button</a>

CSS

a.button1{
 display:inline-block;
 padding:0.35em 1.2em;
 border:0.1em solid #FFFFFF;
 margin:0 0.3em 0.3em 0;
 border-radius:0.12em;
 box-sizing: border-box;
 text-decoration:none;
 font-family:'Roboto',sans-serif;
 font-weight:300;
 color:#FFFFFF;
 text-align:center;
 transition: all 0.2s;
}
a.button1:hover{
 color:#000000;
 background-color:#FFFFFF;
}
@media all and (max-width:30em) {
 a.button1 {
  display:block;
  margin:0.4em auto;
 }
}