JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://github.com/jnbdz/minimizeCode/raw/master/Source/minimizeCode.js"></script>
<button>Minimize CSS</button>
<textarea id="css">
head{
    margin:0;
    }
body{
    margin:0;
    padding:0;
    font-family: "Arial Black";
    font-size:90%;
}
body > .trex, input[type!="email"] {
        margin: 10px;
        cursor: default!important;
    }
header, footer, section, nav, body, head{
    display:block;
}
body img{
    border:none;
}
.clearboth{
    clear:both;
}
body#redbar{
    position:fixed;
    background-color:#ef4135;
    height:5px;
    width:100%;
    z-index:999;
}
#layout{
    margin:0 auto 0 auto;
    width:1000px;
}
#layout_header{
    position:fixed;
    margin-top:5px;
    width:150px;
    float:left;
}
#layout_header h1 span{
    display:none;
}
#layout_header object{
    width:150px;
    height:112.5px;
    overflow:hidden;
}
#site_nav{
    text-transform:uppercase;
}
#site_nav ul{
    margin:0;
    padding:0;
    list-style:none;
}
#site_nav li{
    margin:5px;
    float:right;
}
#site_nav a{
    background-color:#404040;
    padding:4px 7px 4px 7px;
    color:#fff;
    text-decoration:none;
}
#site_nav a:hover, #site_nav a.selected{
    background-color:#ef4135;
}
#site_lang{
    margin-top:10px;
}
#site_lang ul{
    margin:0;
    padding:0;
    list-style:none;
}
#site_lang li{
    display:block;
    float:right;
    margin:5px;
}
#site_lang a{
    color:#000;
    font-family:Arial;
    text-decoration:none;
}
#page_wrapper{
    margin-left:180px;
    padding-top:65px;
}
#page_wrapper header{
    margin-bottom:25px;
}
#page_wrapper header h1{
    display:inline;
    clear:both;
    background-color:#404040;
    padding:4px 7px 4px 7px;
    color:#fff;
    font-size:120%;
}
#page{
    font-family: Arial, Helvetica, sans-serif;
}
#layout_footer{
    padding:30px 0 30px 0;
}
#find_close{
    display:none;
    float:right;
    margin-right:-15px;
}
#find-content{
    background-color:#fff;
    border-radius: 5px;
   ...

CSS

button {
    display: block;
}
textarea, pre {
    overflow: auto;
    width: 400px;
    height: 150px;
    border: 1px solid #000;
}

JavaScript

var trimmer = function(css){
        return css
        //.replace(/\/\/[^\r\n]*/, "")                // strip single line comments
        .replace(/\/\*[^*]*\*\//g,            "")        // strip comments
        .replace(/\s*([\:\;\,\{\}])\s*/g,     "$1")    // strip whitespace
        .replace(/\s+/g,                     " ")     // strip double spaces
        ;
};


$$('button')[0].addEvent('click', function(){
    
    var css = document.id('css').get('value');
    
    var newCss = trimmer(css);//new minimizeCode().css(css);
    
    document.id('minimizecss').set('text', newCss);
    
});