JSFiddle - React, Tailwind, and code Playground

HTML

<div id="content">
            <div class="mainHeader">
                <span>Metro UI Sample Page</span>
                <span class="rightContent">
                    <input type="text"/>
                    <input type="button" value="Go"/>
                </span>
            </div>
            <div class="verticalSpace">&#160;</div>
            <div class="table">
                <div class="tableRow">
                    <div class="tile">
                        <div class="title">Sed fringilla ipsum</div>
                        <div class="content">Etiam diam tortor, varius non pulvinar et, mollis ac lorem.
                            Nulla vel tortor sapien. Nulla facilisi. Sed id dolor ligula, non auctor nisl.
                            Curabitur at purus nisi. Fusce faucibus posuere consectetur. Aliquam euismod lobortis
                            dolor eget tristique.</div>
                    </div>
                    <div class="tile">
                        <div class="image">
                            <img src="the-quick-brown-fox-jumps-over-the-lazy-dog.png"/>
                        </div>
                        <div class="title">The quick brown fox jumps over the lazy dog</div>
                        <div class="content">In at dolor imperdiet arcu venenatis gravida in vel arcu.
                            Nam sagittis neque non turpis euismod a congue urna dictum.</div>
                    </div>
                </div>
                <div class="tableRow">
                    <div class="wideTile">
                        <div class="title">Donec condimentum mauris</div>
                        <div class="content">Proin at felis sed augue iaculis dictum nec quis sem.
                            Nulla scelerisque, velit a dictum volutpat, ante lectus faucibus dui,
                            tincidunt eleifend ipsum enim sed justo. Donec a ligula sit amet tortor
                            molestie vulputate ut porta arcu. Nulla...

CSS

body
            {
                margin: 15px;
                padding: 0;
                text-align: center;
                font-family: Segoe UI, Droid Sans;
                line-height: 20px;
            }
            #content
            {
                position: relative;
                width: 1050px;
                margin: 0 auto;
                padding: 5px;
                text-align: left;
            }
            .tile, .wideTile, .longTile, .footerTile
            {
                background-color: #3BB33B;
                color: #FFFFFF;
                margin: 5px;
                float: left;
                             overflow: hidden;
    
            }
            .tile
            {
                width: 200px;
                height: 200px;
            }
            .wideTile
            {
                width: 410px;
                height: 200px;
            }
            .longTile
            {
                width: 200px;
                height: 410px;
            }
            .footerTile
            {
                clear: both;
                width: 840px;
                height: 100px;
                margin-bottom: 0;
                text-align: center;
                vertical-align: middle;
            }
            .table
            {
                            float: left;
                margin: 0;
                padding: 0;
    width:420px;
            }
            .tableRow
            {
                                margin: 0;
                padding: 0;
            }
            .horizontalSeparator
            {
                display: table;
                float: left;
                width: 10px;
                margin: 0;
                padding: 0;
            }
            .verticalSeparator
            {
                display: table;
                clear: both;
                line-height: 0;
                height: 10px;
                margin: 0;
                padding: 0;
            }
 ...

JavaScript

$(document).ready(function()
        {
            $(".title").hide();
            $(".tile, .wideTile, .longTile").hover(function()
            {
                $(this).find("div[class=title]").slideDown("fast");
            }, function()
            {
                $(this).find("div[class=title]").slideUp("fast");
            });
        });