Html 如何在div块后面显示图片

我有他的svg放大镜：

<form action="" method="get">
    <div>
        <input title="Поиск" style="margin-top: 5px;margin-left: 60px" type="text" class="_2z-tgin">
        <button class="_1PEaSbT" type="submit" style="margin-top: 3px;margin-right: 5px">
          <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="21px" height="20px" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
                            viewBox="0 0 154 148.08"
                             xmlns:xlink="http://www.w3.org/1999/xlink"
                             enable-background="new 0 0 96 96">
               <defs>
                    <style type="text/css">
                                .search {stroke: #000000;stroke-width:10.03;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:22.9256}
                                .fil0 {fill:none}
                    </style>
               </defs>
               <g id="Слой_x0020_1">
                    <metadata id="CorelCorpID_0Corel-Layer"/>
                    <g id="_1195129152">
                         <path class="fil0 search" d="M108.31 86.58c-2.19,3.69 -4.86,7.16 -8.03,10.33 -20.48,20.48 -53.69,20.48 -74.17,0 -20.48,-20.48 -20.48,-53.68 0,-74.16 20.48,-20.48 53.69,-20.49 74.17,-0.01 14,14.01 20.24,43.25 8.03,63.84z"/>
                               <line class="fil0 search" x1="101.83" y1="98.47" x2="143.49" y2= "140.12" />
                    </g>
               </g>
           </svg>
       </button>
   </div>
</form>

.search{stroke:#000000；笔划宽度：10.03；笔划linecap:round；笔划linejoin:round；笔划斜接限制：22.9256}
.fil0{fill:none}

此外，我还有下一个下拉菜单，通过将鼠标悬停在购物车上显示：

但正如你们所看到的，放大镜显示在我的下拉菜单上。它应该在后面，因为它是搜索栏的一部分。

---

我能解决这个问题吗？我试图更改图像上的svg对象，但没用。谢谢。

您在代码中哪里添加了SVG？寻求代码帮助的问题必须包含在问题本身中复制SVG所需的最短代码，最好是以最短的格式。请参见我的下拉菜单上显示的放大镜。我能以某种方式解决这个问题吗？用哪种方式解决？它应该在哪里？既然您使用的是svg元素，为什么不使用

对象来保存

文本

。请将其格式化为显示inlinepost父节点