搜索框内的材料图标JS

Question

我希望搜索框位于搜索框内，但它显示在搜索框的下方。 下面是代码，

<section class="example"> 
      <section class="search-container"> 
       <input type="search" id="sampleSearchInput" ><i class="material-icons">search</i> 
      </section> 
     </section> 

CSS代码 -

input[type="search"] { 
    padding-right:32px; 
} 

.search-container { 
    position:relative; 
    width:20%; 
    margin-left:55%; 

} 

.search-container > input[type="search"] + span { 
    position:absolute; 
    top:12px; 
    right:10px; 
} 

怎么可能是错的？

Answer 1

添加这个你你的CSS

.material-icons{ 
    position: absolute; 
    top:0; 
}