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