внутренний див перетаскивается(jQuery) только вверх/вниз

NilovSerge

Новичок
внутренний див перетаскивается(jQuery) только вверх/вниз

Всем привет
Внутри дива лежит другой див который перетаскивается(jQuery) по родительскому но почему-то только
вверх/вниз :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Title</title>
<link rel="stylesheet" type="text/css" href="./css/cmxform.css" />
<link rel="stylesheet" type="text/css" href="./css/cmxformtemplate.css" />
<style type="text/css">
.ui-widget-content { width: 500px; height: 200px; padding: 0.5em; float: left; margin: 5px;border:2px red; }
</style>
<script type="text/javascript" src="./js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="./js/ui.core.js"></script>
<script type="text/javascript" src="./js/ui.draggable.js"></script>

<script type="text/javascript" >
$(document).ready(function(){

$("#p_draggable").draggable({ containment: 'parent' });

}) //$(document).ready(function(){
</script>

</head>

<body style="cursor: auto;">
<div style="border:1px dotted green; height:200px" >
<div style="position: relative;" id="p_draggable" style="border:1px dotted red; " >
Drag Me, please!
</div>
</div>


</body>
</html>

А как сделать чтобы внутренний див таскался во все стороны?

-~{}~ 18.04.09 19:15:

нашел причину
во внутреннем диве должно быть position: absolute;
 
Сверху