我有以下
HTML和CSS创建一个列表,列表项的最小高度设置.如果没有足够的内容填满整个高度,我希望列表项的内容在中间垂直对齐,而不是顶部.我该怎么办？
<html>
<head>
<style type="text/css">
ul {
width : 300px;
list-style-type: none;
}
li {
min-height : 45px;
vertical-align : middle;
border-bottom : 1px black solid;
}
</style>
<head>
<body>
<ul>
<li>Testing testing 1234</li>
<li>Testing testing 1234 Testing testing 1234</li>
<li>Testing testing 1234 Testing testing 1234 Testing testing 1234</li>
<li>Testing testing 1234 Testing testing 1234 Testing testing 1234 Testing testing 1234</li>
<li>Testing testing 1234 Testing testing 1234 Testing testing 1234 Testing testing 1234 Testing testing 1234</li>
</ul>
</body>
这给了我以下内容：
解决方法
如果您添加了< div>在< li>内并对CSS进行以下更改,似乎有效：
li {
min-height : 45px;
border-bottom : 1px black solid;
}
li div {
height:45px;
display:table-cell;
vertical-align : middle;
}
看到它居住在这里 – 工程在IE8和FF4：http://jsfiddle.net/RrVBh/
