垂直对齐 MaterializeCSS 中的并排列

Question

在本例中，您通常如何垂直对齐 "middle" 按钮：

<div class="row">

  <div class="col s1">
    <h1>Foo</h1>
  </div>

  <div class="col s11 right-align">
    <a href="#" class="btn"><i class="material-icons left">add</i> Add</a>
  </div>

</div>

https://jsfiddle.net/zg9cjmr3/

一旦我在第二个内部 div 中添加 valign-wrapper，它就会变得混乱：

https://jsfiddle.net/zg9cjmr3/1/

Answer 1

将 valign-wrapper class 添加到该行。

<div class="row valign-wrapper">

  <div class="col s1">
    <h1>Foo</h1>
  </div>

  <div class="col s11 right-align">
    <a href="#" class="btn"><i class="material-icons left">add</i> Add</a>
  </div>

</div>