Question

在wordpress中，我试图在特色图片中的黑色div的垂直中心获取我的新闻项目（http://www.projectarthouse.nl/vvruurlo/over-ruurlo/nieuws/eerste-training-obbink-voetbalschool/）的黄色标题（总是 - 即使它的1行/ 3行文本）。我想以与我主页上滑块相同的方式执行此操作，右侧滑块导航中的文本（http://www.projectarthouse.nl/vvruurlo/）。

这里它使用display：table和vertical-align：middle在parend div上显示：table-cell和vertical-align：middle在div的文本内部。

然而，它根本不起作用。文本保持排在最前面。这里出了什么问题？

Answer 1

您可以将display inline-block与伪元素结合使用，如下所示：

.headertitletext {
   display: inline-block !important;
   vertical-align: middle!important;
}

.headertitle:after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
  width: 1px;
  margin-right: -1px;
}

/* Make sure you remove the float on .unskew */
.unskew {
  -webkit-transform: skew(10deg);
  -moz-transform: skew(10deg): -o-transform: skew(10deg);
/* float: left; */
}

div中的垂直对齐文本（浏览器证明）

1 个答案: