JSFiddle - React, Tailwind, and code Playground

by Harsh Bhatnagar

HTML

<div id="harssh">
    <div class="htabmenu">
        <div id="polski-tab" class="current"> <a href="#polski-tab">Polski</a>

            <div> <span>Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello </span>

            </div>
        </div>
        <div id="deutsch-tab"> <a href="#deutsch-tab">Deutsch</a>

            <div> <span>ello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello</span>

            </div>
        </div>
    </div>
</div>

CSS

#harssh {
    width: 95%;
    margin-top:10px;
}
.htabmenu {
    width: 100%;
    min-height: 132px;
    position: relative;
}
.htabmenu>div {
    display: inline;
}
.htabmenu>div>a {
    font-size:medium;
    font-weight:bold;
    color:#fff;
    background-color: #0096D6;
    border-radius:0 6px 0 6px;
    padding:10px;
    text-decoration:none;
}
.tabmenu>div:not(:target)>a {
    background-color: #0096D6;
    border-radius:0 6px 0 6px;
    color: white;
    z-index: 0;
}
.htabmenu>div:target>a, .htabmenu>div.current>a {
    background:#fff;
    cursor:default;
    color:#0096D6;
    z-index: 0;
}
.htabmenu>div>div {
    padding: 10px;
    left: 0;
    top: 22px;
    bottom: 0;
    right: 0;
    z-index: -2;
    display: block;
    margin-top:9px;
    min-height:300px;
    background-color:#eee;
}
.htabmenu>div>div>span {
    position: relative;
    float: left;
}
.htabmenu>div:not(:target)>div {
    position: absolute;
}
.htabmenu>div:target>div, .htabmenu>div.current>div {
    position: absolute;
    z-index: 1;
}

JavaScript

$(function () {
    $(".htabmenu").children("div").click(function () {
        $(".current").removeClass("current");
    })
        .filter(location.hash).click();

});