Material Symbol in Suchtext in eckigen JS

Question

Ich möchte das Suchsymbol im Suchfeld sein, aber es wird darunter angezeigt. Hier ist der Code,

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

CSS code-

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; 
} 

Was möglicherweise falsch sein könnte?

Answer 1

Fügen Sie diese Sie Ihre css

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