MDL - 文本字段顯示中間的底線

Question

文本字段的底線顯示在上方。 沒有CSS使用...

<div class="mdl-textfield mdl-js-textfield"> 
    <input class="mdl-textfield__input" type="text" pattern="[0-9]*" id="phone"> 
    <label class="mdl-textfield__label" for="phone">Phone</label> 
    <span class="mdl-textfield__error">Digits only</span> 
</div> 

<form action="#"> 
    <div class="mdl-textfield mdl-js-textfield"> 

    <input class="mdl-textfield__input" type="text" id="demo-input" /> 

    <label class="mdl-textfield__label" for="demo-input">UserName...</label> 
    </div> 
</form> 

Take a look at what I got

Answer 1

看看我張貼下面的計算器線程的答案。

Material Design Lite - Bottom Line in text field has a slight gap with colored line