JSFiddle - React, Tailwind, and code Playground
HTML
<ul id="menu">
<li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has</li>
<li>Lorem Ipsum </li>
<li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since </li>
<li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into </li>
<li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the </li>
<li>Loreman unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged</li>
<li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged</li>
<li>when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged</li>
<li>Lorem Ipsum is simply...
CSS
* { margin: 0; padding: 0;}
ul { list-style: none;}
ul li { float: left; width: 200px; background: red; margin:2px;}
JavaScript
funcItemsHeight()
function funcItemsHeight(){
var menuItems = document.getElementById('menu').getElementsByTagName('li');
var top = menuItems[0].offsetTop;
var arrHeight = [];
var arrItems = [];
for(var i = 0; i < menuItems.length; i++){
menuItems[i].style.height = 'auto';
}
for(var i = 0; i < menuItems.length; i++){
if(top != menuItems[i].offsetTop){
arrHeight.sort(function(a,b){return b-a});
for(var j = 0; j < arrItems.length; j++){
arrItems[j].style.height = arrHeight[0] + 'px';
}
top = menuItems[i].offsetTop;
arrHeight.length = arrItems.length = 0;
i = i-1;
continue;
}
arrHeight[arrHeight.length] = menuItems[i].offsetHeight;
arrItems[arrItems.length] = menuItems[i];
}
arrHeight.sort(function(a,b){return b-a});
for(var j = 0; j < arrItems.length; j++){
arrItems[j].style.height = arrHeight[0] + 'px';
}
}
window.onresize = funcItemsHeight