问JQuery可调整大小的拆分器异常行为

EN

$(".panel-left,.panel-center")
     .css({
    /* required to allow resizer embedding */
    position: "relative"
  })
  /* check .resizer CSS */
  .prepend("<div class='resizer'></div>")
  .resizable({
    resizeHeight: false,
    // we use the column as handle and filter
    // by the contained .resizer element
    handleSelector: "",
    onDragStart: function(e, $el, opt) {
      // only drag resizer
      if (!$(e.target).hasClass("resizer"))
        return false;
      return true;
    }
 });

html,
body {
  height: 100%;
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  padding: 0;
  margin: 0;
  overflow: auto;
}

.page-container {
  margin: 20px;
}

/* horizontal panel*/

.panel-container {
  display: flex;
  flex-direction: row;
  border: 1px solid silver;
  overflow: hidden;
  /* avoid browser level touch actions */
  xtouch-action: none;
}

.panel-left {
  flex: 0 0 auto;
  /* only manually resize */
  padding: 10px;
  width: 30%;
  min-height: 200px;
  white-space: nowrap;
  background: #838383;
  color: white;
}
.resizer {
    position: absolute;
    top: 0;
    right: 0px;
    bottom: 0;
    left: auto;
    width: 16px;
    cursor: col-resize;
    background: url(https://raw.githubusercontent.com/RickStrahl/jquery-resizable/master/assets/vsizegrip.png) center center no-repeat #535353;
}

.panel-center {
  flex: 1 1 auto;
  /* resizable */
  padding: 10px;
  width: 30%;
  min-height: 200px;
  background: #eee;
}

.panel-right {
  flex: 1 1 auto;
  /* resizable */
  padding: 10px;
  width: 30%;
  min-height: 200px;
  background: #eee;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://rawgit.com/RickStrahl/jquery-resizable/master/src/jquery-resizable.js"></script>

<div class="page-container">
  <div class="panel-container">

    <div class="panel-left">
      left panel
    </div>

    <div class="panel-center">
      center panel
    </div>
    
    <div class="panel-right">
      right panel
    </div>


  </div>


</div>