JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>

<head>

    <link rel="stylesheet" href="./css/style.css">

</head>

<body>
    <section class="bnav">

    </section>
    <header>
        <nav>
            <ul class="wrapper">
                <li>Home</li>
                <li>Place a request</li>
                <li>About Us</li>
                <li>Become a Partner</li>
                <li>Careers</li>
                <li>FAQ</li>
            </ul>
        </nav>
    </header>
    <section style="background:black">
        <section class="core">
            <section class="wrapperx">
                <center><img src="http://placehold.it/50x50 " /></center>
                <h4>left</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras in dui justo. Suspendisse velit mauris, pellentesque quis lobortis ac, pretium at nulla. Cras in nunc in metus ornare rhoncus vitae quis purus. Sed mollis tincidunt faucibus.
                    Cras facilisis at urna at fringilla. Nullam tincidunt imperdiet nisi, id cursus dolor blandit eget. Etiam accumsan mauris in faucibus congue. Nunc congue dolor sed est tempor aliquet. Duis vitae massa commodo, pellentesque purus fringilla,
                    lacinia turpis. Morbi eros diam, ullamcorper dapibus mauris id, venenatis rutrum erat. Nunc vel nunc sit amet magna semper finibus.</p>
            </section>
            <section class="wrapperx">
                <center><img src="http://placehold.it/50x50 " /></center>
                <h4>middle</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras in dui justo. Suspendisse velit mauris, pellentesque quis lobortis ac, pretium at nulla. Cras in nunc in metus ornare rhoncus vitae quis purus. Sed mollis tincidunt faucibus.
                    Cras facilisis at urna at fringilla. Nullam tincidunt imperdiet nisi, id cursus dolor blandit eget. Etiam accumsan mauris in faucibus congue. Nunc congue dolor sed est tempor aliquet. Duis vitae massa commodo,...

CSS

body {
    margin: 0;
    padding: 0;
}

.wrapper {
    max-width: 960px;
    margin: 0 auto;
}

.core {padding:50px;margin:0 auto;max-width:1000px; display: flex;}

.wrapperx {
    padding: 5px;
    margin: 10px;
    width: 300px;
    text-align: justify;
    background: rgb(212, 212, 212);
    border-radius: 10px;
}

.wrapperx:hover {
    padding: 10px;
    color: red;
}

.wrapperx h4 {
    text-align: center;
}

.bnav {
    padding: 100px;
    border: solid 2px black
}

header nav {
    background: rgb(38, 62, 186);
    border: solid 2px black;
}

header nav ul {
    background: blue;
    border: solid 2px black;
    padding: 20px;
    text-align: center;
}

header nav ul li {
    list-style: none;
    display: inline;
    padding: 15px;
    font-size: 18px;
    font-family: sans-serif;
}