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>