Resizable div in a resizable div issue
Hi all,
i'm new about jqueryui but i'm having a lot of fun with it.
Until now... :-)
I cannot understand why i cannot have a resizable div in a resizable div.
This is the example.
- <style>
.demo
{
width: 150px;
height: 150px;
padding: 5px;
position: absolute;
top: 150px;
left: 200px;
}
.fence
{
width: 350px;
height: 450px;
padding: 5px;
position: absolute;
border-width: medium;
border-style: dashed;
border-color: Gray;
background-color: #fafafa;
left: 0px;
top: 0px;
}
</style>
</head>
<body>
<div id="container">
<div class="fence" name="fence1">
<div class="demo" style="background-color: Orange;" name="alfa">
</div>
</div>
</div>
</body>
<script type="text/javascript">
$(function () {
$('.demo').draggable().resizable();
$('.fence').draggable().resizable().droppable();
});
</script>
</html>
i'm gonna crazy.
Try if you want on jsfiddle. Fence div cannot be resized.
If i remove the div (demo) inside the "fence" it works.
Why?
I will be very happy if you can help me about this issue.... thank you very much.