title: How to make a div draggable on another div?
body: <p>I need to make a div dragable over the another div . How to do this ?</p>
  
  <p>This is my html and i made this responsive using media query </p>
  
  <pre><code>&lt;style&gt;
      .text-canvas{
          z-index:1;
          position:absolute;
      }
      .imageupload{
          z-index:-1;
      }
  &lt;/style&gt;
  
  &lt;script&gt;
      function submit_button(){
      alert('hiii');
     }
  
  &lt;/script&gt;
  &lt;div class="parent-canvas"&gt;
        &lt;div class="text-canvas" contenteditable="true"&gt;
          my text
       &lt;/div&gt;
       &lt;div class="image-canvas"&gt;
           &lt;div class="imageupload" onclick="submit_button()"&gt;
              &lt;img src="img.png"&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here i need to make this text-canvas div dragabble, so that user can drag that my text and he can place it on any where in the image (only inside image-canvas div   ).
  I see the html drag and drop , but i didn't understand how to apply this . </p>