<script type="text/javascript" src="../../jquery-1.2.6.js"></script>\r
<script type="text/javascript" src="../../ui/ui.core.js"></script>\r
<script type="text/javascript" src="../../ui/ui.resizable.js"></script>\r
+ <style type="text/css">\r
+ #resizable { background-position: top left; width: 150px; height: 150px; }\r
+ #resizable, #container { padding: 0.5em; }\r
+ #container { width: 300px; height: 300px; }\r
+ </style>\r
<script type="text/javascript">\r
$(function() {\r
$("#resizable").resizable({
</head>\r
<body>\r
-<div id="container" style="width: 600px; height: 600px; background-color: #0f0;">
- <div id="resizable" style="width: 200px; height: 200px; background-color: #f00;">\r
+<div id="container" class="ui-widget-content">\r
+ <p>Container</p>
+ <div id="resizable" class="ui-widget-header">\r
<p>Resize me</p>\r
</div>\r
</div>