Positioning my JQuery Popup Box

Positioning my JQuery Popup Box

I just learned jquery and I want to apply a very simple dialog or popup box into my application. I have the following codes in my HTML:

      <div id="GLD_dialogbox" title="WARNING!" style="font-size:14;color:bf0000">
            <p>Please login as administrator ! </p>          
      </div>

Here is the JQuery:
      <script type="text/javascript">
         $(function(){
            $( "#GLD_dialogbox" ).dialog({position: [50,100],autoOpen: true,resize: function( event, ui ){$( this ).dialog( "option", "title",ui.size.height + " x " + ui.size.width );
               }
            });

         });
      </script>

No matter what I did with the position:[50,100] my pop up window still maintain the same position like I did not change anything. I also did css like one of the posting in this forum:

      <script type="text/javascript">
         $(function(){
            $( "#GradLoad_dialogbox" ).dialog("widget").css({top:550px, left:800px});
               }
            });

         });
      </script>

but nothing changed!
I've been goggling since last Saturday, get so many threads about positioning a dialog box, tried so many suggestions, but none work! my dialog box stay the same!!
Can anyone tell me what have I done wrong? Thank you!