CSS：如何使用display垂直对齐div中的元素：table-cell

Question

我想垂直对齐div中的两个按钮和一个span。 div有：

display: table-cell

我不知道该怎么做。我有这个Fiddle和你一样 可以看到元素水平对齐。我需要它们 垂直对齐。

我该怎么做？

Answer 1

按钮的默认显示值为sudo chown -R _mysql:_mysql /usr/local/mysql/ 。

将按钮设置为display: inline-block以覆盖整个宽度，并将它们与display: block对齐。

＆＃13;

＆＃13;

margin: 0 auto

＆＃13;

.postcard-left-menu {
  display: table;
  position: absolute;
  left: 0;
  width: 10%;
  height: 100%;
  background-color: #57D5B8;
}
.postcard-left-menu-buttons {
  display: table-cell;
  vertical-align: middle;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  height: 50%;
  background-color: red;
}
.postcard-left-menu-buttons .button {
  font-size: 25px;
  color: white;
  display: block;
  margin: 0 auto;
}
.postcard-left-menu-buttons span {
  font-size: 25px;
  color: white;
}

＆＃13;

＆＃13;

＆＃13;