html行与行怎么对齐,html – 如何垂直对齐运行多行的文本

基于针对类似问题

here提出的解决方案,您可以执行类似的操作.

>将链接文本放在跨度内.

>给这些跨度显示：内联块和适当的宽度;这是li项目的原始宽度减去图像和填充.

.main-services {

overflow: auto;

padding: 17px 0 9px 0;

}

.main-services li {

list-style: none;

float: left;

border-right: 1px dashed #E53B00;

padding-right: 14px;

}

.main-services li a {

display: block;

height: 78px;

color: #ED5D04;

text-decoration: none;

}

.main-services li a img {

vertical-align: middle;

}

.main-services li a span {

display: inline-block;

vertical-align: middle;

}

.service-1 span { width: 85px; }

.service-2 span { width: 131px; }

.service-3 span { width: 151px; }

• 

  Some text goes here

• 

  More text here

• 

  More text goes here but this text overruns

注意：这在IE8中不起作用.