Question

我有一个与CSS flex相关的问题，我是一个Web开发人员，但不是CSS专家，我需要你对这个CSS flex问题的帮助。

以下是plnkr代码段，您可以在此处查看我想要的内容：Plunker

  .flex-container {
    padding: 0;
    margin: 0;
    list-style: none;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row;
    justify-content: space-around;
    align-items: center;
  }
  .flex-item {
    background: #e6e6e6;
    padding: 10px;
    align-self: stretch;
  }

我想要那个：

所有弹性物品都应伸展。
左侧的Flex项目应该是框的垂直和水平居中。
右侧的Flex项目应垂直：居中，水平：左侧。

提前致谢，感谢您的所有帮助：）

Answer 1

我更新了您的<a href="http://plnkr.co/edit/JdsXLwJeOQirmjJhulFa?p=preview">Plunker[1]</a> Plunker。请查看并告诉我这是您需要的。

我已将flex-container添加到橙色div中，因此高度将是容器的高度

CSS Flex：flex项目垂直拉伸，文本居中

1 个答案: