JSFiddle - React, Tailwind, and code Playground

by alemarch

HTML

<div id="bigParent">
    <div class="divChild">...</div>
    <div class="divChild">...</div>
    <div class="divChild">...</div>
    <div class="divChild">...</div>
    <div class="divChild">...</div>
    <div class="divChild">...</div>
    <div class="divChild">...</div>
    <div class="divChild">...</div>
    <div class="divChild">...</div>
    <div class="divChild">...</div>
</div>

CSS

#bigParent{
    height: 100%;
}

.divChild {
    margin: 0px;
    height: 10%;
    border: solid 1px #ccc;
    overflow: hidden;
    counter-increment: ctMenu 1;
}
.divChild:after {
    content: "menu" counter(ctMenu); 
}

html, body {
    padding: 0px;
    margin: 0px;
    height: 100%;
}

JavaScript

$(function(){
    $("#bigParent").height($(window).height()-20)
})