Modal Dialog - Adding space at the bottom of the page

Modal Dialog - Adding space at the bottom of the page

Hey guys,

When the Dialog appears on the page, it adds a space at the bottom of the page, which isn't covered by the overlay. I've heavily styled the dialog box, so could this have something to do with it? My code is...

JS
  1.         $("#register").dialog({
  2.                     modal: true,
  3.                     width: 791,
  4.                     height: 495,
  5.                     autoOpen: true,
  6.                     resizable: false
  7.                 });
  8.                
  9.                 $('#reg_link').click(function(){
  10.                     $("#register").dialog('open');
  11.                     return false;
  12.                 });
  13.      
  14.                $('#reg_pop_close').click(function(){
  15.                     $("#register").dialog('close');
  16.                     return false;
  17.                 });

HTML
  1. <div id="register" title="Register">
  2.             <div class="top"></div>
  3.             <div class="mid">
  4.                 <div class="cont">
  5.                     <a href="#" id="reg_pop_close"><img src="images/cross.png" alt="Close" /></a>
  6.                     <p class="ttl">Register with the ActivCoventry Community</p>
  7.                     <p class="deets">Facilisi nam liber tempor cum soluta nobis eleifend option congue. Laoreet dolore magna aliquam erat volutpat ut wisi enim ad minim veniam quis nostrud. Decima eodem modo typi qui nunc nobis videntur</p>
  8.                     <img src="images/reg_box_ipod_ban.png" alt="Win an iPod!" />
  9.                     <img src="images/example_emails.png" alt="Example Emails" class="example_emails" />
  10.                     <form action="#" method="post" class="reg_form">
  11.                         <ul>
  12.                             <li>Facilisi nam liber tempor cum soluta nobis eleifend option congue. Laoreet dolore mag na aliquam.</li>
  13.                             <li>Quam littera gothica quam nunc putamus parum claram. Dolor in hendrerit in vulputate velit esse molestie consequat vel, illum dolore eu.</li>
  14.                             <li>Option congue nihil imperdiet doming id quod mazim placerat facer.</li>
  15.                             <li>Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet.</li>
  16.                         </ul>
  17.                         <p><label for="reg_name">Your Name:</label><br />
  18.                             <input type="text" class="text" id="reg_name" name="reg_name" />
  19.                         </p>
  20.                         <p><label for="reg_email">Your Email:</label><br />
  21.                             <input type="text" class="text" id="reg_email" name="reg_email" />
  22.                         </p>
  23.                         <p><input type="checkbox" name="reg_tandc" id="reg_tandc">&nbsp;<label for="reg_tandc">I have a read and understood the <a href="#">Terms and Conditions</a></p>
  24.                         <p class="submit"><input type="hidden" name="reg_submit" value="Submit" /><input type="image" src="images/reg_btn.png" class="btn" name="reg_submit_btn" value="Submit" /> <a href="#"><span>We respect your privacy</span></a></p>
  25.                     </form>
  26.                 </div>
  27.             </div>
  28.             <div class="clear"></div>
  29.             <div class="btm"></div>
  30.         </div>

CSS
  1. #register {
  2.     display: none;
  3. }
  4. #register .top {
  5.     background: url(../images/reg_top_bg.png) no-repeat left top;
  6.     padding: 14px 0 0 0;
  7. }

  8. #register .mid {
  9.     background: url(../images/reg_mid_bg.png) repeat-y left top;
  10.     padding: 0 14px 0 14px;
  11.     float: left;
  12. }

  13. #register .cont {
  14.     padding: 22px;
  15.     background: #FFF;
  16.     position: relative;
  17.     float: left;
  18. }

  19.     #register .cont .example_emails {
  20.         float: left;
  21.     }
  22.        
  23.     #register #reg_pop_close {
  24.         position: absolute;
  25.         top: 5px;
  26.         right: 5px;
  27.     }
  28.    
  29.     #register .cont .reg_form {
  30.         width: 400px;
  31.         float: right;
  32.     }
  33.         #register .cont .reg_form ul {
  34.             list-style: none;
  35.         }
  36.        
  37.             #register .cont .reg_form ul li {
  38.                 background: url(../images/tick.png) no-repeat left top;
  39.                 padding: 0 0 0 20px;
  40.                 margin: 0 10px 10px 0;
  41.                 width: 170px;
  42.                 float: left;
  43.                 text-align: left;
  44.                 font-size: 1.1em;
  45.                 line-height: 1.1em;
  46.                 font-family: Helvetica, Arial, sans-serif;
  47.                 color: #353535;
  48.             }
  49.            
  50.             #register .cont .reg_form p {
  51.                 font-size: 1.1em;
  52.                 line-height: 1.1em;
  53.                 font-family: Helvetica, Arial, sans-serif;
  54.                 color: #353535;
  55.                 text-align: left;
  56.             }
  57.            
  58.                 #register .cont .reg_form p a {
  59.                     color: #F27E37;
  60.                 }
  61.            
  62.                 #register .cont .reg_form p.submit a span {
  63.                     position: relative;
  64.                     top: -10px;
  65.                 }
  66.                    
  67.             #register .cont .reg_form input.text {
  68.                 width: 320px;
  69.                 border: 1px solid #7F9DB9;
  70.                 margin: 3px 0 0 0;
  71.            }

  72. #register .btm {
  73.     background: url(../images/reg_btm_bg.png) no-repeat left top;
  74.     padding: 14px 0 0 0;
  75. }

  76.     #register p.ttl {   
  77.         text-align: left;
  78.         font-size: 2.2em;
  79.         font-family: Helvetica, Arial, sans-serif;
  80.         color: #353535;
  81.         font-weight: bold;
  82.     }
  83.    
  84.     #register p.deets {   
  85.         text-align: left;
  86.         font-size: 1.2em;
  87.         line-height: 1.2em;
  88.         font-family: Helvetica, Arial, sans-serif;
  89.         color: #353535;
  90.     }

Thats a fair amount of code I know, but I thought I'd give you guys the lot. The space it adds at the bottom looks like its the same height as the dialog box.

Any thoughts?

Thanks,

Tom