我正在尝试在输入字段中添加svg作为背景图标。问题是我必须给svg一个宽度和高度，否则它将在输入字段中过大。但是如果影响输入的宽度和高度。任何人都可以帮我解决这个问题吗？我对使用SVG不是很熟悉。
CSS：
input.prefs-active {
min-width:40%;
height:auto;
border-radius: 3px;
border: 1px solid #333366;
padding: 15px;
font-family: "helvetica neue1 0";
font-size: 16px;
color: #595959;
margin-bottom:33px;
background: url(../images/x-icon.svg) no-repeat;
width:16px;
height:16px;
background-position:right;
}
HTML：
<input class="prefs-active" type="text" value="abcname@email.com">
SVG：
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 21.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
<style type="text/css">
.st0{fill:#333366;}
</style>
<path class="st0" d="M97.1,7.4c1.2-1.2,1.2-3.2,0-4.5c-1.2-1.2-3.2-1.2-4.5,0L50.3,45.2L8,2.9c-1.2-1.2-3.2-1.2-4.5,0
s-1.2,3.2,0,4.5l42.3,42.3L3.5,92c-1.2,1.2-1.2,3.2,0,4.5c1.2,1.2,3.2,1.2,4.5,0l42.3-42.3l42.3,42.3c1.2,1.2,3.2,1.2,4.5,0
c1.2-1.2,1.2-3.2,0-4.5L54.8,49.7L97.1,7.4z"/>
</svg>