在MaterializeCSS中垂直对齐一列。

Question

在这个例子中，一般如何垂直对齐 "中间 "的按钮。

<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.netzg9cjmr3

我一加 valign-wrapper 在第二个内页div中，就会被弄乱。

https:/jsfiddle.netzg9cjmr31）。

Answer 1

添加 valign-wrapper 类到该行。

<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>