I am new to working with SVG files and I have a question about placing a text field over an SVG file. Is it possible to add a text field within the SVG file itself? Currently, I am using the SVG file as an <img> in my HTML code. Can anyone guide me on how to achieve this?
Here is the CSS code snippet:
input[type="text"] {
background-color: white;
border: 1px solid rgba(0, 0, 0, 0.15);
font-size: 115%;
max-width:300%;
float:right;
width:40%;
min-height:6.45%;
position:absolute;
left:2.68%;
top:70%;
}
#textbox{
max-width:300%;
float:right;
width:20%;
min-height:6.45%;
position:absolute;
left:1.70%;
top:70%;
z-index:1;
}
And here is the relevant part of my HTML file:
<html>
<head>
</head>
<body>
<div id="textbox">
<input type="text"/>
</div>
<img src="samp.svg"/>
</body>
</html>
If anyone has experience with adding text fields over SVG files, your help would be greatly appreciated!