JSFiddle - React, Tailwind, and code Playground

HTML

<header class="mw1140p">
        <img id="logo" src="http://www.vectortemplates.com/raster/batman-logo-big.gif">
</header>
    <section id="content">
        <div class="mw1140p row">
            <aside class="col w25">
                <form action="" method="post">
                        <label for="keyword">Type your keywords</label>
                        <input type="text" name="keyword">
                        <button class="green">Ajouter</button>   
                 </form>
                    <div id="design">
                        <p>Put 100% please !</p> 
                    </div>
            </aside>
                <main class="col w75">
                    <ul id="content-list">
              <li class="list-item row">
                 <h3>Title</h3>
                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce gravida at dolor sed semper. Aenean justo magna, ultrices non odio sit amet, feugiat commodo elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nulla congue libero id arcu bibendum, sed faucibus velit laoreet. Sed nec nunc at nibh ultricies sagittis. Suspendisse lorem massa, finibus et lacinia sit amet, blandit vel est. Ut non suscipit risus, sit amet dignissim erat. Aliquam eget posuere nibh.</p>
              </li>
              <li class="list-item row">
                 <h3>Title</h3>
                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce gravida at dolor sed semper. Aenean justo magna, ultrices non odio sit amet, feugiat commodo elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nulla congue libero id arcu bibendum, sed faucibus velit laoreet. Sed nec nunc at nibh ultricies sagittis. Suspendisse lorem massa, finibus et lacinia sit amet, blandit vel est. Ut non suscipit risus, sit amet dignissim erat. Aliquam eget posuere nibh.</p>
              </li>
              <li class="list-item...

CSS

html,body {
    height: 100%;
}

.mw1140p {
    max-width: 1140px;
    margin: 0 auto;
}

.row {
    clear: both;
}

.row {
    display: table;
    table-layout: fixed;
    width: 100%;
    height:100%;

}

.row > *,
.col {
    display: table-cell;
    vertical-align: top;
}

aside .w25 {
  width: 25%;
    height:100%;
}

.w75 {
  width: 75%;
  height:98%;
  overflow-y:hidden;
}

header {
    height: 70px;
    background-color: #7d7d7d;
    border: 2px solid black;
}

#logo {
    height: 40px;
}

main {
    padding: 40px 0;
    background-color: #7d7d7d;
    border: 2px solid black;
}

label {
    color: white;
}

input {
    width: 98%;
    margin: 10px 0;
}

aside form{ width:100%;
    height:18%;
    background-color: #7d7d7d;
    border: 2px solid black;
    padding: 40px 0;
overflow:hidden;}

#design {
    width: 100%;
    height: 82%;
    padding-top: 20px;
    background: red;
    border: 2px solid black;
    overflow:hidden;

}

h3, p {
    color: white;
}