无法将子元素的大小调整为其父级的全宽

Question

为什么我无法将child元素调整为其父级的全宽？全宽度总是缺少大约10或20像素。

<div id='parent'>
<div id='child'>CHILD</div>
</div>

css

#parent{
  width:450px;
  height:320px;
  margin:0;
  background:lightgreen;
}
#child{
  width:120px;
  height:45px;
  margin:0;
  background:gold;
}

js

$("#child").resizable({
    aspectRatio: true,
    containment: "#parent"
});

JSFIDDLE

Answer 1

实际上，我认为使用Contament和aspectRatio存在问题。也许它无法保持最后像素的比例，因为调整大小不是每像素像素。

为了解决这个问题，您可以使用下面的代码，它可以正常工作。

$("#child").resizable({
   aspectRatio: true,
   maxWidth: $("#parent").width()
});

如果高度可能大于宽度，则可以添加

maxHeight : $("#parent").height()

JSFIDDLE