Html 中间垂直对齐，用于<；a>；在<；李>；菜单

我需要在菜单的中间标签垂直对齐。所以，如果客户机更改标签的值，并将其分成两行，它将保持在中间。据我所知，垂直对齐：中间对齐适用于表格单元格，但我需要从

元素生成菜单。请参见下面的示例代码

html

---

在Hi处的工作原型现在给li显示：表格单元格和删除

像这样

    li {
     display:table-cell;
       vertical-align: middle;
float:left; // remove this line  
    }

---

只需将

行高：60px

添加到

a

标签中，它就可以工作了

---

使用

显示：内联块

用于

忘记删除垂直对齐：中间；-当然，因为他们不工作，如果有两行文本，它将破坏菜单元素。
ul {
  list-style: none;
}
li {
  float:left;
  border: 1px solid;
  margin: 1px;
  height: 60px;
  width: 60px;
  background: tomato;
  text-align: center;
  vertical-align: middle;  
}
a {
  vertical-align: middle;
}

    li {
     display:table-cell;
       vertical-align: middle;
float:left; // remove this line  
    }

ul {
  list-style: none;
}
li {
  float:left;
  border: 1px solid;
  margin: 1px;
  height: 60px;
  line-height: 60px;
  width: 60px;
  background: tomato;
  text-align: center;
  vertical-align: middle;  
}
a {
  vertical-align: middle;
  display: inline-block;
  line-height: normal;
}