段中的垂直对齐内容（语义UI）

Question

有没有办法在段类div中垂直居中？我有以下标记：

<div class="stretched row">
  <div class="two wide column">
    <div class="ui basic segment">
      <select>
        <!-- OPTION VALUES IN HERE -->
      </select>
    </div>
  </div>
  <div class="column">
    <div class="ui basic segment>
     <!-- DIV CONTENT -->
    </div>
  </div>
  <div class="column">
    <div class="ui basic segment">
      <!-- DIV CONTENT -->
    </div>
  </div>

现在，由于拉伸行类，所有3列都具有相同的高度，内部的div div也是如此，如下所示：

我希望3段内的内容垂直居中。相反，它们总是出现在顶部。我尝试添加 class =＆＃34; ui中间对齐的基本细分＆＃34; ，但它不起作用。将 class =＆＃34;中间对齐的列＆＃34; 添加到父列的中心，但是它们不会占据列的所有垂直空间，因为它们有边框和彩色背景，它看起来很奇怪（每个部分都有自己的高度）。

我想避免在细分中添加填充，因为我不知道它们的高度，其内容从1行（选择）到几行文本（从2到7）不等行，取决于用户选择的内容。

谢谢！

Answer 1

正如@VXp建议的那样，将{display: flex; align-items: center}应用于段类可以很好地工作。