Question

在以下代码的示例中，

<html>
<head>
<style>
.gallery li {
    border: 1px dotted black;
    width:100px;
    height:100px;
    float:left;
    list-style:none;
    margin:10px;
    text-align:center;
    line-height:100px;
    vertical-align:middle;
}
</style>
</head>
<body>
<ul class="gallery">
    <li>
        <img src="http://dummyimage.com/20x20/000/000000.png" />
    </li>
</ul>
</body>
</html>

我发现，只有Firefox才能使其垂直居中。虽然Opera和Chromium（谷歌Chrome）不能这样做。无论如何在Opera和Chromium中解决这个问题？

Answer 1

在DOCTYPE元素之前添加html，例如

<!DOCTYPE html>
<html>

在Opera和Google Chrome中的无序列表中垂直对齐图像

1 个答案: