JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
      <div class='panel designer-panel'>
        <div class='panel-body designer-panel-body panel-warning' style='height:9.37cm'>

          <div class='designer-field' contenteditable='true' style='top:2.30cm;left:5.84cm;width:10.24cm;height:0.63cm;font-family:Arial;font-size:14pt;font-weight:bold;'>vnimi+&#39; &#39;+dok.tasudok</div>
          <div class='designer-field' contenteditable='true' style='top:2.30cm;left:16.37cm;width:2.68cm;height:0.61cm;font-size:14pt;'>DOK.kuupaev</div>
          <div class='rectangle' style='border-width: 1px;background-color:#FFFFFF;top:2.99cm;left:1.34cm;width:18.05cm;height:5.29cm'></div>
          <div class='designer-field' contenteditable='true' style='top:3.01cm;left:1.53cm;width:9.71cm;height:0.55cm;font-size:12pt;'>m.FIRMA</div>
          <div class='designer-field' contenteditable='true' style='top:3.01cm;left:12.13cm;width:3.13cm;height:0.53cm;font-size:12pt;'>ise.telefon</div>
          <div class='designer-field' contenteditable='true' style='top:3.01cm;left:17.11cm;width:1.89cm;height:0.55cm;font-size:12pt;text-align:right;'>ise.regnr</div>
          <div class='designer-label' contenteditable='true' style='top:3.04cm;left:11.39cm;text-align:right;font-size:12pt;'>Tel.</div>
          <div class='designer-label' contenteditable='true' style='top:3.04cm;left:15.71cm;font-size:12pt;'>Reg.Nr</div>
          <div class='designer-field' contenteditable='true' style='top:3.62cm;left:1.55cm;width:9.45cm;height:0.55cm;font-size:12pt;'>ise.tanav</div>
          <div class='designer-field' contenteditable='true' style='top:3.70cm;left:15.16cm;width:3.37cm;height:0.55cm;font-size:12pt;'>ise.vatpayno</div>
...

CSS

.designer-panel-body {
          min-height: 1px;
          overflow: hidden;
          margin: 0;
          padding: 0;
        }
        .panel-footer {
          background-color: inherit;
        }
        .designer-panel,
        .designer-resetmargins {
          margin: 0;
          padding: 0;
        }
        .designer-verticalline,
        .designer-horizontalline,
        .designer-rectangle {
          font-size: 1pt;
          border: 1px solid #000000;
        }
        .designer-field {
          border: 1px solid lightgray;
          white-space: pre;
          overflow: hidden;
        }
        .ui-selecting {
          background-color: lightskyblue;
          color: white;
        }
        .ui-selected {
          background-color: lightskyblue;
          border-color: darkblue;
          color: white;
        }
        .designer-label {
          white-space: pre;
          /*overflow: hidden;*/
        }
        .designer-field,
        .designer-label {
          font-family: "Times New Roman";
          font-size: 10pt;
          z-index: 2;
        }
        .designer-verticalline,
        .designer-horizontalline,
        .designer-rectangle,
        .designer-field,
        .designer-image,
        .designer-label {
          position: absolute;
        }

JavaScript

function getpos(e) {
          return {
            X: e.pageX,
            Y: e.pageY
          };
        }

        function Rect(start, stop) {
          this.left = Math.min(start.X, stop.X);
          this.top = Math.min(start.Y, stop.Y);
          this.width = Math.abs(stop.X - start.X);
          this.height = Math.abs(stop.Y - start.Y);
        }

        $(function() {
          var startpos;
          var selected = $([]),
            offset = {
              top: 0,
              left: 0
            };
          $(".designer-verticalline, .designer-rectangle, .designer-field, .designer-image").resizable();

          // http://stackoverflow.com/questions/705250/is-there-a-jquery-plugin-which-combines-draggable-and-selectable#8643716
          // teha: seal on ka mousedown mis andis viga, kaseda kasutada
          var $liigutatavad = $(".designer-verticalline, .designer-horizontalline, .designer-rectangle, .designer-field, .designer-image, .designer-label");
          $liigutatavad.draggable({
            start: function(event, ui) {
              var $this = $(this);

              if ($this.hasClass("ui-selected")) {
                // if this is selected, attach current offset
                // of each selected element to that element
                selected = $(".ui-selected").each(function() {
                  var el = $(this);
                  el.data("offset", el.offset());
                });
              } else {
                // if this is not selected, clear current selection
                selected = $([]);
                $liigutatavad.removeClass("ui-selected");
              }
              offset = $this.offset();
            },

            drag: function(event, ui) {
              // drag all selected elements simultaneously
              var dt = ui.position.top - offset.top,
                dl = ui.position.left - offset.left;
              selected.not(this).each(function() {
                var $this = $(this);
           ...