jQuery Resizable not working (but Draggable is working)?

jQuery Resizable not working (but Draggable is working)?

I am able to get the jQuery component, Draggable, to work, but can't do the same with Resizable. I went here and downloaded the library with Draggable and Resizable functionality. My jQuery code looks like:

  1. <script type="text/javascript" src="Scripts/jquery-1.4.2.min.js"></script>    
  2. <script type="text/javascript" src="Scripts/jquery-ui-1.8.1.custom.min.js"></script>  
  3. <script type="text/javascript">  
  4.     //Makes the consarned thing resizable is all...  
  5.     $(function() {  
  6.          $(".resizable").resizable(  
  7.          {  
  8.              containment: 'window',  
  9.              ghost: 'true',  
  10.              maxHeight: $('#DraftsDueListGridView').css('height'),  
  11.              maxWidth: $('#DraftsDueListGridView').css('width')  
  12.           }  
  13.           );  
  14.       });  
  15. </script>

The markup is as follows:

  1. <head runat="server">  
  2. <style type="text/css">  
  3. div.resizable  
  4. {  
  5. }  
  6.   
  7. div#draftsduelist  
  8. {  
  9. margin: 0px auto;  
  10. height: 640px;  
  11. width: 1170px;  
  12. }  
  13. </style>  
  14.   
  15. <title></title>  
  16. </head>  
  17.   
  18. <body>  
  19. <form id="form1" runat="server">  
  20. <div id="draftsduelist" class="resizable">  
  21. </form>  
  22. </body>

It's strange because Draggable works just fine...  Any suggestions on why this isn't working?