JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menuButton">
            <div class="menu1">
                <label class="BlackBoldXXLarge">משה</label>
            </div>
            <div class="menu2">
                <label class="BlackBoldXXLarge">משה</label>
            </div>
        </div>

CSS

.menuButton{
    text-align:center;
   
   
}

    .menu1{
        border: 4px solid black;    
        height: 50px;
        text-align: center;
        width:160px;
        margin: 0 auto;      
    }

    .menu2{
        border-bottom: 4px solid black;
        border-left: 4px solid black;
        border-right: 4px solid black;
        height: 30px;  
        text-align: center; 
      
    margin: 0 auto;
     width:130px;
   
    
    }

.menuButton:hover{
    cursor:pointer;
  
}