My current objective involves the following:
<div id="table">
<div id="user"></div>
<div id="user1"></div>
</div>
Upon clicking a button, the following actions take place:
$("#body").append("<div id=\"user-wrap\"></div>");
$('#user').appendTo($('#user-wrap'));
$('#user1').appendTo($('#user-wrap'));
$('#user-wrap').appendTo($('#table'));
Subsequently, a moz-transform is applied to user-wrap. However, in order to apply another transform, the userwrap div must be removed. This causes issues with preserving the transforms. While I have managed to address this by storing values separately and reapplying them, the problem arises when scale transformations are applied - resulting in added distance between the child elements. How can this issue be resolved?
In summary, my aim is to implement transforms on a group of children within a div, then remove the div while maintaining the scale/rotate and spacing between the children. Any assistance from JavaScript wizards and CSS experts would be greatly appreciated! ;)