首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >CSS在li中垂直对齐文本

CSS在li中垂直对齐文本
EN

Stack Overflow用户
提问于 2011-12-17 17:36:57
回答 5查看 301.7K关注 0票数 114

我正在显示一行中具有固定高度和宽度的框的数量,这些框是从标签生成的。现在,我需要将文本垂直居中对齐。CSS垂直对齐没有影响,也许我遗漏了什么?

我没有寻找技巧使用(边距,填充,行高),这些将不会工作,因为一些文本很长,将打破为两行。

请找到实际代码:

CSS代码

代码语言:javascript
复制
ul.catBlock{
  width:960px; 
  height: 270px; 
  border:1px solid #ccc; 
}

ul.catBlock li{
  list-style: none; 
  float:left; 
  display:block; 
  text-align: center; 
  width:160px; 
  height: 100px;
}

ul.catBlock li a{ 
  display: block;  
  padding: 30px 10px 5px 10px; 
  height:60px;
}

HTML代码

代码语言:javascript
复制
<ul class="catBlock">
 <li><a href="#">IP Phone</a></li>
 <li><a href="#">Dual SIM Switch Server</a></li>
 <li><a href="#">IP PBX</a></li>
</ul>
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/8543859

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档