JSFiddle - React, Tailwind, and code Playground
HTML
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>whohasmorefollowers</title>
<style>
body{
padding:0;
margin:0;
}
*{
outline;none;
}
#btn {
border:none;
width:400px;
height:8%;
color:#ffffff;
font-size:200%;
padding:0px;
text-align:center;
background: rgba(255,0,255,0.6);
background: rgb(255,0,255);
border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
}
#btn:hover {
padding: 1px;
background: rgba(255,0,255,0.7);
border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
}
#user1{
border:none;
width:400px;
height:8%;
color:#ff00ff;
font-size:200%;
padding:0px 0 0 0;
text-align:center;
background: rgba(255,0,255,0.1);
background: rgb(255,200,255);
border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
}
#user2{
border:none;
width:400px;
height:8%;
color:#ff00ff;
font-size:200%;
padding:0px 0 0 0;
text-align:center;
background: rgba(255,0,255,0.1);
background: rgb(255,200,255);
border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
}
#page{
margin-top:20px;;
margin-left:20%;
margin-right:20%;
text-align:center;
}
#results{
margin-top:50px;
width:100%;
float:center;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}
#nav li{list-style:none}
#nav{height:16px;margin-bottom:0px;background-color:#fff}#nav
ul{float:right}
#nav
li{float:left;width:60px;text-align:center;border-left:1px solid #fff}
#nav
li a{display:block;color:#f0f;font-size:85%;text-decoration:none;text-transform:uppercase;font-weight:normal;line-height:16px}
#nav li.selected a{background-color:#000}
#nav li a:hover{background-color:#f0f;color:#fff;}
a{
text-decoration:none;
color:red;
}
a div{
//display:none;
position:...