相关疑难解决方法(0)

内联块锚标记上的垂直对齐中间

我需要链接和按钮看起来一样,但是我无法以"按钮"标签的方式垂直对齐"a"标签内的文本.重要的是要注意标签需要能够处理多行文本(因此行高不起作用).

a,button {
  display: inline-block;
  -moz-box-sizing: border-box;
  width: 150px;
  height: 150px;
  vertical-align: middle;
  border: 1px solid #000;
  text-align: center;
}
Run Code Online (Sandbox Code Playgroud)

请参阅下面的jsfiddle:

http://jsfiddle.net/bZsaw/3/

正如您所看到的,我可以使用内部的span标签和将"display:table"设置为"a"并将"display:table-cell"和"vertical-align:middle"设置为span,但这在IE7中不起作用.

a,button {
    width: 150px;
    height: 150px;
    border: 1px solid #000;
    text-align: center;
}

a {
    display: table;
    -moz-box-sizing: border-box;
}

a span, button span {
    vertical-align: middle;
    text-align: center;
}

a span {
    display: table-cell; 
}
Run Code Online (Sandbox Code Playgroud)

寻找一个简单的CSS解决方案.

css internet-explorer-7 internet-explorer-6

11
推荐指数
3
解决办法
4万
查看次数