html - 垂直对齐，让我同样头疼

Question

您好，我正在尝试在 h1 中垂直对齐 anchor 文本，我尝试过垂直对齐居中，但一些行高技巧无法使其正常工作!

<header>
<div></div>
<h1><a>somelink</a></h1>
</header>

CSS:

div{
height:80px;
width:80px;
float:left;
}

h1{
      font-size: 32px;
      line-height: 32px;
      min-height: 80px;
      vertical-align: middle;
      a{
        line-height: inherit;
        vertical-align: middle;
      }

这就是我的目标，我可能可以用表格来解决它，但是关于是否应该使用表格存在很多争论，所以我试图找到一个替代方案:

Answer 1

DEMO

你可以为此添加一个parent div :-

 <div id="parent">
    <div id="child"></div>        
    <h1><a>somelink is here.somelink is here.somelink is here.somelink is here.somelink is here.somelink is here.somelink is here.somelink is here.</a></h1>
 </div>

CSS

#child {
    height:200px;
    width:80px;
    float:left;
    background: #333333;
}
#parent{
    border:solid 1px yellow;
    width: 100%;