JSFiddle - React, Tailwind, and code Playground

by Beben Koben

HTML

<h1>Tutorial Blog for Stylish Blogger</h1>

<center><script type="text/javascript">
function jump(form){var myindex=form.menu.selectedIndex
if(form.menu.options[myindex].value!="0")
{window.open(form.menu.options[myindex].value,target="yourframename");}}</script>
<form name="bebenmenu2" ACTION=URI><select name="menu" onchange="jump(this.form)" readonly="readonly"><option value="0">Where to?</option><option value="0"></option><option value="http://beben-koben.blogspot.com/" style="background-color:#debe94">Great Blog</option><option value="http://www.divinecss.com/">Divine CSS</option><option value="http://www.makebetterwebsites.com/">Better Website</option><option value="http://www.moluv.com/">Moluv</option><option value="http://www.pagecrush.com/">PageCrush</option><option value="http://www.cssdesignawards.com/">CSS Awards</option><option value="http://www.1pagewebdesign.com/">1 Page Design</option><option value="http://www.cssmania.com/">CSS Mania</option><option value="http://www.csswinner.com/">CSS Winner</option><option value="http://www.html5arena.com/">HTML 5 Arena</option><option value="http://www.cssplayers.com/">CSS Players</option><option value="http://www.cssdrive.com/">CSS Drive</option><option value="http://cssmayo.com/">CSS Mayo</option><option value="http://www.thebestdesigns.com/">The Best Designs</option><option value="http://cssremix.com/">CSS Remix</option><option value="http://www.unmatchedstyle.com/">Unmatched Style</option><option value="http://www.awwwards.com/">Awwwards</option><option value="http://www.cssbeauty.com/">CSS Beauty</option><option value="http://styleboost.com/">Style Boost</option><option value="http://bestwebgallery.com/">Best Web Gallery</option><option value="http://csscreme.com/">CSS Creme</option><option value="http://creattica.com/">Creattica</option><option value="http://www.webcreme.com/">Web Creme</option><option value="http://designshack.co.uk/">Design Shack</option><option...

CSS

*
{
    margin:0;
    padding:0;
}
body
{
    background:#debe94;
    color:#000;
    font:15px Calibri, Arial, sans-serif;
    text-shadow:1px 1px 1px #FFFFFF;
    padding:10px;
}
a,a:visited
{
    text-decoration:none;
    outline:none;
    color:#a00;
}
a:hover
{
    color:#fff;
}
footer
{
    background:#D3A76F;
    position:fixed;
    width:100%;
    border-top:1px solid #333;
    height:70px;
    bottom:0;
    left:0;
    color:#fff;
    text-shadow:1px 2px 0 #000;
}
footer h2
{
    font:25px/26px Acens;
    font-weight:bold;
    left:70%;
    margin:0px 0 0 150px;
    padding:20px 0;
    position:relative;
    width:400px;
}
footer a.orig,
a.orig:visited
{
-moz-box-shadow:0px 0px 20px #000;
-webkit-box-shadow:0px 0px 20px #000;
box-shadow:0px 0px 20px #000;    
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
    border:none;
    text-decoration:blink;
    font-weight:bold;
    color:#f00;
    font-size:14px;
    left:37%;
    line-height:46px;
    margin:12px 0 0 -405px;
    position:absolute;
    top:0;
    width:75px;
}
.cred
{
    padding-bottom:15px;padding-top:50px;
}
h1{text-align:center;text-shadow:3px 3px 5px #000;padding:55px;font-family: Verdana, Geneva, sans-serif;font-size:20pt;color:#D3A76F;}