JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li><a>A</a></li>
    <li><a>Bsdsddsqdqsddsqsdqdqsqsqqdsqdqs<br>dqsdqsdqsdsdqsdsqqsd</a></li>
    <li><a>C</a></li>
</ul>

CSS

ul { 
    display: flex; 
    flex-direction: column;
    height: 100px; 
  align-items: center;

    
}
ul li { 
    flex: 1, auto;
    display: inline-block;
    vertical-align: middle;
    line-height: 50px;
    text-align: center;
    list-style: none;
    border: 1px solid gray;
    border-radius:2px;
}
ul li a:hover { 
    cursor: pointer;
}