是否可以使用display：-webkit-box;在div中垂直对齐文本？

Question

我正在使用div，该属性具有以下css属性：display: -webkit-box;。

我的div包含我要垂直对齐中间的文本。在不更改赋予div的display属性的情况下是否可以实现？

其他信息：

我正在使用最新版本的Chrome，并尝试了vertical-align: middle;，但失败了。

Answer 1

-webkit-box-orient有两种情况，具体取决于其值：

1. -webkit-box-orient: vertical：您应该使用-webkit-box-pack: center来垂直对齐文本。

2. -webkit-box-orient: horizontal：您应该使用-webkit-box-align: center来垂直对齐文本。

所有这些情况都类似于flexBox中的对齐方式。

Answer 2

以下语句对我有用：

-webkit-box-align: center;

https://jsfiddle.net/awt39v5s/1/

对于“旧的” flexbox定义，https://www.smashingmagazine.com/2011/09/css3-flexible-box-layout-explained/是很好的资源。