JSFiddle - React, Tailwind, and code Playground

by jblasco

HTML

<div class="post">
    <div class="thumbnail"> 
        <img src="http://placehold.it/40x20" alt="Placeholder" />
    </div>
    <h1>Title</h1>
    <a class="view" href="#"><span></span></a>
</div>

CSS

* {
    margin: 0px;
    padding: 0px;
}

div.post {
    position: relative;
    padding: 20px;
}
div.post:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
div.post:hover {
    background-color: #333;
}
    div.post div.thumbnail {
        float: left;
        background-color: #CCC;
    }
    div.post:hover div.thumbnail {
        background-color: #333;
    }
    div.post h1 {
        float: right;
        font-size: 20px;
    }
    div.post a.view {
        
    }
        div.post a.view span {
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;
        }