絶対配置された要素は、削除時に他の要素に影響する

Question

ボタンをクリックすることで、絶対配置され、動的に作成される複数のdivがあります。クリックされると、それらは相対的な位置に置かれたコンテナに配置され、各divのボタンをクリックするとdivを削除し、divを削除すると他の位置に影響します。 HTMLで

function create() { 
 
    var $home = $('<div class="cabine"></div>'); 
 
    $("#container").append($home); 
 
}

.cabine {     /*class that all div's share*/ 
 
    position: absolute; 
 
    top:5%; 
 
    left:10%; 
 
    width:135px; 
 
    height:135px; 
 
    float:left; 
 
    background: red; 
 
} 
 

 
#container {   /* Where the div's are placed*/ 
 
    position: relative; 
 
    background-image: url(wall.jpg); 
 
    background-color: #FFFFFF; 
 
    border: 1px solid #000; 
 
    width: 100%; 
 
    height: 300px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button onclick="create()">Create Cabine</button> 
 
<div id="container"></div>

Answer 1

あなたは#containerの代わり.containerを持っています。