CSS: Fixed with horizontal menu, with variable width tabs, using ul

Question

I have a horizontal menu. The markup looks like this:

   
Item 1
   
Longer Item 2
   

        

Answer 1

This is a case for

Display:Table-Man

ul {
  display: table;
  width: 100%;
  table-layout: fixed;
}
li {
  display: table-cell;
}

Unfortunately, you should abandon the thought of supporting IEs 6 and 7, but else this is the way to go (or switching to HTML tables, which might or might not be so far away from the semantic content of the markup).