display:teble 布局. 实现内容高度不一致,但li标签保持一致的高度.

<div id="wrap">
  <p id="p1">11111111111</p>
  <p id="p2">222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222</p>
  <p id="p3">33333333333</p>
</div>

#wrap {
  display:table;
  border: 1px solid green;
}
p {
  display:table-cell;
  width: 100px;
  word-break: break-all;
  vertical-align: top; //重点需要加这个,不然内容会垂直居中非常难看
}
#p1 {
  background: red;
}
#p2 {
  background: orange;
}
#p3 {
  background: blue;
}

效果图: