JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="rows.css" />
        <script type="text/javascript">
        </script>
    </head>
    <body>
        <div id="content">
            <div class="content-item">
                <div class="content-icon-wrapper">
                    <div class="content-icon">
                    </div>
                </div>
            </div>
            <div class="content-item">
                <div class="content-icon-wrapper">
                    <div class="content-icon">
                        TEST
                    </div>
                </div>
            </div>
            <div class="content-item">
                <div class="content-icon-wrapper">
                    <div class="content-icon">
                        <p>Test Datums</p>
                    </div>
                </div>
            </div>
            <div class="content-item">
                <div class="content-icon-wrapper">
                    <div class="content-icon">
                        <p>Test Datums2</p>
                    </div>
                </div>
            </div>
            <div class="content-item">
                <div class="content-icon-wrapper">
                    <div class="content-icon">
                        <p>Test Datums3</p>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>

CSS

body {
    margin: 15px;
    background-color: #F2F2F2;
}
#content {
    max-width: 65em;
    margin: 15px auto;
    position: relative;
    padding: 0px;
}
.content-item {
    width: 15%;
    height: 4em;
    border: 1px solid #333;
    float: left;
    margin: 2%;
}
.content-icon-wrapper {
    width: 100%;
    height: 100%;
    display: table;
}

.content-icon {
    display: table-cell;
    vertical-align: middle;
}