可调整大小的添加边距

Question

我在模态上使用.resizable，它似乎弄乱了模态中的表格。例如，模态设置为800px和10px边距，内部表格为100％。当我抓住调整大小手柄并开始移动时，桌子的左侧不会移动，但是右侧缩小了20px并在调整大小期间保持在那里，然后当我调整大小时达到20px标记，然后回到原始大小。如何在调整大小时保持表格在20px中缩小并使其在整个调整大小中保持齐平？

https://jsfiddle.net/n5c352qy/

  $( function() {
    $( "#Modal" ).resizable();
  } );

<div class="container">
<div id="Modal">
<table>
<tr><td>Tested</td></tr>
<tr><td>Tested</td></tr>
</table>
</div>

#Modal{
  max-width: 800px;
  width: 800px;
  padding: 10px;
}
table{
  width: 100%;
  background: red;
}
table td{
  color: white;
}