相关疑难解决方法(0)

如何在div中垂直对齐文本？

我试图找到最有效的方法来将文本与div对齐.我尝试了一些东西,似乎都没有用.

.testimonialText {
  position: absolute;
  left: 15px;
  top: 15px;
  width: 150px;
  height: 309px;
  vertical-align: middle;
  text-align: center;
  font-family: Georgia, "Times New Roman", Times, serif;
  font-style: italic;
  padding: 1em 0 1em 0;
}

Run Code Online (Sandbox Code Playgroud)

<div class="testimonialText">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
  in reprehenderit in voluptate velit esse …

Run Code Online (Sandbox Code Playgroud)

html css vertical-alignment

shi*_*juo

2018 06-24

1102
推荐指数

19
解决办法

157万
查看次数

内联/内联块元素的CSS垂直对齐

我试图将几个inline和inline-block组件垂直对齐div.为什么span这个例子坚持要被推倒？我都试过vertical-align:middle;和vertical-align:top;,但没有任何变化.

HTML:

<div>
  <a></a><a></a>
  <span>Some text</span>
</div>?

Run Code Online (Sandbox Code Playgroud)

CSS:

a {
    background-color:#FFF;
    width:20px;
    height:20px;
    display:inline-block;
    border:solid black 1px;
}

div {
    background:yellow;
    vertical-align:middle;
}
span {
    background:red;
}

Run Code Online (Sandbox Code Playgroud)

结果:
在此输入图像描述