SOURCE

<div id="app">
    <div class="super-tab">
        <div class="tab-item">
            <div class="tab-item-content"><div>Tab 1</div></div>
        </div>
        <div class="tab-item  on">
            <div class="tab-item-content"><div>Tab 2</div></div>
        </div>
        <div class="tab-item">
            <div class="tab-item-content"><div>Tab 3</div></div>
        </div>
    </div>    
</div>

#app {
    width: 40%;
    height:200px;
    margin:20px auto;
    border:1px solid #ccc;
    font-size:12px;
}
.super-tab {
    width: 100%;
    height: 30px;
    display: flex;
    flex-direction: row;
    align-items: center;
}
.super-tab .tab-item {
    flex-grow: 1;
    height: 100%;
}
.super-tab .tab-item .tab-item-content {
    width: 75%;
    height: 100%;
    margin:0px auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}
.super-tab .tab-item.on .tab-item-content{
    color: #096;
    border-bottom: 2px solid #096;

}