Css 如何在价格表中进行垂直对齐

我们希望在垂直对齐中心显示li元素。有什么想法吗

我的css是

.pricing-table ul{border-radius:3px;width:160px;text-align:center;float:left;background-color:#FFF;border-color:#CCC;border-style:solid;border-width:1px;margin:3px;padding:0}
.pricing-table ul li{background-color:#EFEFEF;border-radius:0;list-style:none!important;min-height:58px;border-color:#B83737;border-width:2px;padding:5px}
.pricing-table li:nth-child(odd){background-color:#fff}
.pricing-table ul .heading{color:#000;background-color:#d5d8dd;font-weight:700;font-size:16px}
.pricing-table ul .price{font-weight:700}

我的html代码

    <div id="pricing-table" class="pricing-table">
<ul><li>Shimla</li><li>Manali</li><li>Dharamshala, Delhi, Manali, Shimla</li><li>Dalhousie</li><li>Chandigarh</li><li>Delhi</li></ul>
<ul><li>Shimla</li><li>Manali</li><li>Dharamshala</li><li>Dalhousie</li><li>Chandigarh, Delhi, Manali, Shimla</li><li>Delhi</li></ul>                      
</div>

Shimla
Manali
达拉姆沙拉，德里，马纳利，Shimla
达尔豪西
昌迪加尔
德里
Shimla
Manali
Dharamshala
Dalhousie
昌迪加尔，德里，马纳利，Shimla
德里

试试这个：

移除最小高度：58pxcss属性在中。定价表ul li 并将padding属性从5px设置为25px

.pricing-table ul li{
    padding: 25px;
}

---

第一个想法。。。为什么不用桌子呢

再想一想。。。使用表格css显示属性，然后可以使用垂直对齐中间来居中文本

缺点。。。我将文本包装在一个span元素中。。。并使用显示表、表行和表单元格得到正确的结果

Css:

.pricing-table ul {
    display: table;
    ...
}
.pricing-table ul li {
    display:table-row;
    ...
}
.pricing-table ul li span {
    display: table-cell;   
    height:58px;
    vertical-align: middle;
}

---

当然，我建议删除

！重要信息

当您在此处使用特殊性时。我按照你说的实现了这个过程，但是列中的每个单元格都不均匀，特别是在垂直对齐中，就像图中所示