css样式中怎么实现文本和文本框垂直居中
笨小孩日记
2016-04-21 13:42
#d5{border:solid red;
width:250px;height:100px;
position:absolute;
right:100px;
bottom:100px;
background-color:pink;
text-align:center;
display:table-cell;
vertical-align:middle;
}
a{display:inline-block;
font-size:20px;
font-weight:bold;
height:20px;
margin:auto 0px;
line-height:100px;
border:solid;}
<div id="d5" >
<a classname="c1" href="http://www.w3school.com.cn" title="帮助用户进行网站建设资料查询">wsc网站
</a>
</div>
为什么用了display：table-cell;
vertical-align:middle;
a标签中的文本框仍然没有垂直居中效果？？有什么方法可以实现这个效果？？
4回答
-
- qq_曾经_0
- 2016-04-21 14:44:10
你这样写的话，display:inline-block把A标签上的这个去掉
-
- 竹音小子
- 2016-04-21 15:01:32
你用这个方法重写你的代码，就可以实现垂直居中了
-
- 竹音小子
- 2016-04-21 15:00:22
垂直居中问题：
html代码如下：
<div>
<i></i><span>需要居中的内容</span>
</div>
css代码如下：
span{
display:inline-block;
vertical-align:middle;
}
i{
display:inline-block;
height:100%;
vertical-align:middle;
}
-
- jie_11
- 2016-04-21 14:34:51
设置a属性的width、height然后text-align：center，在设置一个行高就可以了
JavaScript进阶篇
468195 学习 · 21891 问题
相似问题