MaterializeCSS - 对齐按钮和输入字段

Question

与 materializeCSS我试图将一个按钮和一个输入字段放在另一个附近(类似于 default file input )，如下图所示。



但是我很难实现它，因为输入字段标签在按钮上方或字段在按钮下方。

 <div class="row">
    <div class="col s12 m4 l3">
      <div class="file-field input-field">
        <button class="waves-effect waves-light btn-large" type="submit" name="action">Button
        </button>
        <div class="file-path-wrapper">
          <input id="email_input" type="text">
          <label for="email_input">email</label>
        </div>
      </div>
    </div>
  </div>

http://codepen.io/anon/pen/rxKbZz

有没有办法实现它？

谢谢你

Answer 1

在 2017 年 Align input text and button on its right 代码:

<div class="row">
   <form class="col s12">
       <div class="row">
           <div class="input-field col s6">
               <input id="name" type="text" class="validate">
               <label for="name">Name</label>
           </div>
           <div class="input-field col s6">
               <button class="btn waves-effect waves-light" type="submit" name="action">Go!
               </button>
           </div>
       </div>
   </form>
</div>

JSFiddle here

希望它有效!