CSS为什么垂直对齐：中间不起作用？

Question

所以我有这个css：

.footer .light {
    height: 150px;
    background-color: #66cccc;
    text-align: left;
    padding: 15px 42px;
    vertical-align: middle;
}

然后我的html看起来像这样：

<div class="light">
    <img src="images/logo.png" alt="" />            
</div>

这个div是页脚的lat部分。更改css中的内容会导致更改div的样式，但图像不在中间。我错过了什么？

Answer 1

尝试这种风格

.light{
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -100px;
}
.light img{
    
    
    }

<div class="light">
    <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTRTNqG0lSFen_tzyTf0NTkiRBBWJZGK_L0mCssHs172s3B9Cy8" alt="" />            
</div>