I want to display image inside tag with other contents. All things are rendering properly but the image is not being rendering in the UI.
Here is my source code.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Portal</title>
<style>
.display-top-right {
position: fixed;
left: 40%;
top: 10%;
width: 25vw;
height: 28vh;
}
</style>
</head>
<body>
<div class="p-1 my-container">
<div class="container-fluid" style="margin-top: 30px;">
<div id="profile-box">
<svg class="display-top-right">
<defs>
<filter id="f4" x="0" y="0" width="200%" height="200%">
<feOffset result="offOut" in="SourceGraphic" dx="20" dy="20" />
<feColorMatrix result="matrixOut" in="offOut" type="matrix"
values="0.2 0 0 0 0 0 0.2 0 0 0 0 0 0.2 0 0 0 0 0 1 0" />
<feGaussianBlur result="blurOut" in="matrixOut" stdDeviation="10" />
<feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
</filter>
</defs>
<rect width="20vw" height="25vh" stroke="green" stroke-width="1"
fill="white" filter="url(#f4)" />
<text x="15" y="35" font-size="10pt" style="fill:black;">
Test Company Solutions <a xlink:href=""> Sign Out</a>
</text>
<img height="50" width="50" x="0" y="50" src="~/Content/Images/Generator.png"></img>
<text x="100" y="100" style="fill:black;" font-size="10pt">
<tspan x="100" y="105">Test Name</tspan>
<tspan x="100" y="125">TestName@gmail.com</tspan>
</text>
</svg>
</div>
</div>
</div>
</body>
</html>
Can you please help me to identity what is going wrong?
Thanks in advance.