How to align height of all tabs in horizontal ul menu in css

1.7k Views Asked by At

Hello I have ul menu with fixed width and auto height but some links are too long and they occupy 2 lines. How to align high of all tabs accordingly to the highest one?

1

There are 1 best solutions below

0
On

This is it, buddy: DEMO

Screenshot:

enter image description here

CSS:

li{
  list-style:none;
  display:inline-block;
  background-color:lightGrey;
  padding:5px;
  width:100px;
  display:table-cell;
}
ul{
  padding:0px;
  display:table-row;
}

HTML:

<ul>
    <li>
      Link 1
    </li>
    <li>
      Link 2
    </li>
    <li>
      Longest Largest Biggest and the Baddest Link
    </li>
    <li>
      Link 3
    </li>
  </ul>