css - jquerymobile中的签名板问题

Question

我添加了用于签名的画布元素和用于根据屏幕宽度调整大小的 css。一切工作正常，但是当我画线或其他东西时，触摸的地方和画的线距离很小。

我怎样才能解决这个问题 ？

这是我的代码：

HTML：

<div class="wrapper">
<div class="container">
<div class="canvas-container">
<canvas id="canvas"   style="background-color:#fff9cb;border:0px;"></canvas>
</div>
</div>
</div>

查询：

var canvas = document.querySelector("canvas");
var signaturePad = new SignaturePad(canvas);

CSS：

.wrapper {
   display: table;
   padding: 0;
   width: 100%;
   height: 90px;
   position: relative;
 }
.container {
   display: table-cell;
   vertical-align: middle;
 }
.canvas-container {
  position: relative;
  min-width: auto;
  margin: 0 auto;
}
#canvas {
  width: 100%;
  height: 90px;
}