Materialise的輸入字段標籤合併

Question

我有作爲一種形式的一部分該接觸信息部分：

<div class="row"> 
<div class="col s12"> 
    <i class="material-icons prefix">account_circle</i> 
    <input id="nameico" type="text" class="validate"> 
    <label for="nameico">Contact Name</label> 
</div> 
<div class="col s12"> 
    <i class="material-icons prefix">email</i> 
    <input id="emailico" type="email" class="validate"> 
    <label for="emailico">Contact Email</label> 
</div> 
<div class="col s12"> 
    <i class="material-icons prefix">phone</i> 
    <input id="telico" type="tel" class="validate"> 
    <label for="telico">Contact Phone</label> 
</div> 
</div> 

但是所有三個標籤彼此重疊所有的人的名字的第一輸入字段內。

Answer 1

這裏是我的代碼可能是它可以幫助你。

的jsfiddle鏈接 - JSFiddle

HTML代碼 -

<div class="row"> 
<div class="col s12 input-field"> 
    <i class="material-icons prefix">account_circle</i> 
    <input id="nameico" type="text" class="validate"> 
    <label for="nameico">Contact Name</label> 
</div> 
<div class="col s12 input-field"> 
    <i class="material-icons prefix">email</i> 
    <input id="emailico" type="email" class="validate"> 
    <label for="emailico">Contact Email</label> 
</div> 
<div class="col s12 input-field"> 
    <i class="material-icons prefix">phone</i> 
    <input id="telico" type="tel" class="validate"> 
    <label for="telico">Contact Phone</label> 
</div> 
</div>