JSFiddle - React, Tailwind, and code Playground

by gnossienne

HTML

<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap.js"></script>
<link rel="stylesheet" href="http://twitter.github.io/bootstrap/assets/css/bootstrap.css">
<br/>
<br/>
<br/>
<!-- <div class="span9"style="background-color: yellow">
    <div class="span2">
        <span>2013-05-10 20:10:12</span>
    </div>
    <div class="span5">
        <span>Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth</span>
    </div>
    <div class="span1">
        <i class="icon-remove icon-black"></i>
        <i class="icon-resize-full icon-black"></i>
        <i class="icon-envelope icon-black"></i>
    </div>
</div> -->
<!-- <li class='history_entry'>
    <table class='history'>
        <tr class='historyHeader'>
            <td class='historyDate'>
                2013-05-10 20:10:12
            </td>
            <td class='historyTitle' id='%(titleID)s'>Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic</td>
            <td class='historyShare'><i class="icon-envelope icon-black"></i></td>
            <td class='historyExpand'><i class="icon-resize-full icon-black"></i></td>
            <td class='historyClose'> <i class="icon-remove icon-black"></i></td>
        </tr>
        <tr>
            <td colspan='4' class='history' id='1'>
            </td>
        </tr>
    </table>
</li> -->

<div class="alert success fade in">
            <button type="button" class="close" data-dismiss="alert"><i title="Close" class="option-icon icon-remove icon-black"></i></button>
            <strong>Holy guacamole!</strong> Best check yo self, you're not looking too good.
          </div>

<div class="alert user-history-entry user-comments span9">
    <div class="history-entry-header span9">
        <div class="date span2"><strong>2013-05-10 20:02:10</strong>
        </div>
        <div class="summary span6">n officia aaute, datat skateboard dolor</div>
        <div...

CSS

div.user-history-entry {
    padding: 10px 20px;
}
div.history-entry-header {
    margin-left: 0px;
}
div.date {
    margin-left: 0px;
}
div.summary {
    text-align: justify;
}
div.options {
    margin-right: 0px;
}
.option-icon {
    float: right;
    font-size: 20px;
    font-weight: bold;
    line-height: 20px;
    color: #000000;
    text-shadow: 0 1px 0 #ffffff;
    opacity: 0.4;
    filter: alpha(opacity=40);
    margin-left: 6px;
}
.option-icon:hover {
    color: #000000;
    text-decoration: none;
    cursor: pointer;
    opacity: 0.8;
    filter: alpha(opacity=80);
}
.user-comments {
}