JSFiddle - React, Tailwind, and code Playground

HTML

<div class="tab_1 active">Вкладка 1</div>
<a href="http://site.com"><div class="tab_2">Вкладка 2</div></a>
<div class="tab_content active">Содержание вкладки 1</div>

<br><br>

<div class="tab_1">Вкладка 1</div>
<a href="http://site.com"><div class="tab_2 active">Вкладка 2</div></a>
<div class="tab_content active">Содержание вкладки 2</div>

CSS

.tab_1 {
    float:left;
    width:100px;
    height:20px;
    border:1px solid black;
    border-bottom:none;
}
.tab_2, 
.tab_1 {
    margin-bottom: -1px;
    z-index: 1;
}
.tab_2 {
    margin-left:120px;
    width:100px;
    height:20px;
    border:1px solid black;
    border-bottom:none;
}

.tab_content {
    border:1px solid black;
}

.active {
    background-color:yellow;
    
}