Начал тестировать в мобильных браузерах, UC Browser показывал толоко первое слово в тексте ссылки из двух слов между которыми пробел, сделал высоту ссылки auto (она вблочная для выделения всего <li> при наведении, теперь слово выравниваются по верхнему краю. vertical align: middle для <li> и <a> не помог.



<nav>
<ul class="top_ul">
<li><a href="#.html">Слово</a></li>
<li><a href="#i.html">Слово</a></li>
<li><a href="#.html">Слово слово</a></li>
</ul>
<ul>
<li><a href="#.html">Слово</a></li>
<li><a href="#.html">Слово-слово</a></li>
<li><a href="#.html">Слово</a></li>
</ul>

ul {
list-style: none;
}
nav ul {
display: flex;
margin: 0;
padding: 0;
letter-spacing: -.3em;
}
nav li {
display: inline-block;
height: auto;
width: 33%;
flex-basis: auto;
flex-grow: 1;
letter-spacing: normal;
}
a {
text-decoration: none;
outline: none;
width: 100%;
height: auto;
font-size: 1.3em;
}
nav a {
display: block;