如何使用CSS`resize`将元素的大小调整为小于Chrome上的初始高度/宽度的高度/宽度？

Javascript解决方案：

function resizableStart(e){    this.originalW = this.clientWidth;    this.originalH = this.clientHeight;    this.onmousemove = resizableCheck;    this.onmouseup = this.onmouseout = resizableEnd;}function resizableCheck(e){    if(this.clientWidth !== this.originalW || this.clientHeight !== this.originalH) {        this.originalX = e.clientX;        this.originalY = e.clientY;        this.onmousemove = resizableMove;    }}function resizableMove(e){    var newW = this.originalW + e.clientX - this.originalX,        newH = this.originalH + e.clientY - this.originalY;    if(newW < this.originalW){        this.style.width = newW + 'px';    }    if(newH < this.originalH){        this.style.height = newH + 'px';    }}function resizableEnd(){    this.onmousemove = this.onmouseout = this.onmouseup = null;}var els = document.getElementsByClassName('resizable');for(var i=0, len=els.length; i<len; ++i){    els[i].onmouseover = resizableStart;}

上面的解决方案使用mouseover和mouseout触发resizableStart和resizableEnd。问题是，如果要调整大小的元素具有子元素，则将鼠标放在子元素上时，该元素会收到一个mouseout事件，并且紧随其后，它会收到一个mouserover从子元素冒泡的事件。