JSFiddle - React, Tailwind, and code Playground

HTML

<div class="customMenu">
   <div class="item">
     <div class="item-label">
      Tesst A
     </div>
     <div class="item-content">
       XXXXXXX<br />
       XXXXXXX<br />
       XXXXXXX<br />
       XXXXXXX<br />
       XXXXXXX<br />
       XXXXXXX<br />
       XXXXXXX<br />
       XXXXXXX<br />
       XXXXXXX<br />
       XXXXXXX<br />
       XXXXXXX<br />
     </div>
   </div>
   <div class="item">
     <div class="item-label">
       Tesst B
     </div>
   </div>
</div>

CSS

.customMenu {
  width: 100%;
  border: 1px red solid;
  position: relative;
  height: 100px;
}

.item-label {
  width: 33%;
  border: 1px green solid;
}

.item-content {
  display: none;
  position: absolute;
  left: 33%;
  top: 0;
  right: 0;
  bottom: 0;
 }

.item:hover .item-content {
  display: block;
  border: 1px solid blue;
  overflow: auto;
}