Need help in making the textarea element draggable

[Kshakira556]

HTML

<div id = "symbolBtn">
	<button id = "symbol" onclick = "myFunction()">+</button>
	</div>
	<div id = "inputContainer">
		<textarea  type = "text" draggable = "true" cols = "40" rows = "5"></textarea>
	</div>

JavaScript

let addBtnEl = document.getElementById("symbol")

function myFunction() {
	addBtnEl = document.createElement("TEXTAREA");
	addBtnEl.setAttribute("type", "text")
	addBtnEl.setAttribute("draggable", "true")
	addBtnEl.setAttribute("cols", "40")
	addBtnEl.setAttribute("rows", "5")
	addBtnEl.setAttribute("id", "#inputContainer")
	addBtnEl.setAttribute("value", "false")
	document.body.appendChild(addBtnEl)
}

CSS

 #inputContainer  {
	 display: flex;
	 margin: -150% 40.5% 50% 40.5%;
	 height: 10%;
	 width: 17%;
 }
 
 textarea {
	 font-weight: bold;
	 border-left: 1px solid red;
	 border-right: 1px solid red;
	 border-bottom: 1px solid red;
	 border-top: 15px solid red;
	 border-radius: 5px;
	 background-color: yellow;	 
	 padding: 1.5px;
	 cursor: move;
 }
 
 #symbolBtn {
	display: flex; 
 }

[eatapancake]

In the CSS file, add “resize: both” to the “textarea { }”. If you just want to resize the vertical portion of it, it’s “resize: vertical”.

For more information:

CSS resize property

[Kshakira556]

Thank you, but that doesn’t help with the draggable effect that I’m trying to create. I tried the DnD method but I don’t think I implemented it correctly.
Sorry, I’m new at coding. So any feedback is valued.

[eatapancake]

Aw, sorry about that. I think I misunderstood what you were looking for. I’m also new, so sorry I wasn’t able to help out. I hope you eventually figure it out.