如何將可調整大小的兒童div適合其父母

Question

我嘗試結合可拖動，可調整大小，可放置的jquery函數和flex css3屬性。

我快完成了，但是可調整大小的div出現了問題。 我的代碼是這樣寫的：

<div class="flex-container">
   <div class="flex-item"> <!---- droppable & draggable --->
      <div class="resize"> 
      </div>
   </div>
</div>

但是，當我調整div的大小時，孩子的右邊框和父母的右邊框之間有一個空白，我不想要它。

當我在flex容器上使用display：flex屬性時，只有這個問題。

這是問題的一個小提琴：

http://jsfiddle.net/xRRdX/

（由於這個原因，我需要使用這個奇怪的可調整大小的子div配置： jQuery UI可拖動和相對位置，在調整大小時更改為絕對值 ）

我是新來的，需要幫助！

Answer 1

錯誤！

不能是自我的，因為這在父div內並且不確定大小會是多少

.flex-item {
    -moz-flex: 1 0 auto;
    -webkit-flex: 1 0 auto;
    flex: 1 0 auto;
}

現在從他父親那里繼承下來

-webkit-flex: 1 0 inherit;

Inherit關鍵字指定屬性應從其父元素繼承其值。

.ui-resizable{
    min-width: 100px;
    min-height: 100px;
}

絕對位置必須是這樣，否則我不會被疊加

position屬性指定用於元素的定位方法的類型（靜態，相對，絕對或固定）。