How do I fix my footer and the bottom of this page? - html

Question

I'm trying to fix a table and make it look better (I describe the issue better in the screen shot below).
this is a screen shot of what's going on and what I would like to happen:
What do I change in my style sheet?
the css file is located at rankingclimber.com/css/style.css (the footer part is clearly marked) and the signup part is clearly marked
The sign up page is located at www.rankingclimber.com/signup.php
here's the code for the footer file: rankingclimber.com/footer.php and the footer is called on the main page: rankingclimber.com/signup.php

Answer 1

To fix the placement of the line, move <div class="form_bt"></div> to just after the closing tag of <div class="form_tp">.
To fix the "Create Account" button not being inside the form, from <div class="chkp3">, remove float: left and margin-bottom: 20px. Then, to <a class="btn1">, add margin-top: 20px.
To fix the footer, move <div id="footer"> to just after the closing tag for <div id="wrapper">.
Tested in Firefox only, with Firebug.
Another answer pointed out you have missing close tags. In that case, my answer might not be very useful as the problems could have been caused purely by those missing tags.
Fix the missing close tags, and then see what your page is like before following any of the steps I posted.

Answer 2

I think, add margin:0; !important to the .form_bt style. Safari Web Inspector shows it currently has a margin-right of -60px. And in your HTML, put the div.form_bt outside of the <form> element, it's currently inside it.

Answer 3

try these fixes, I can't validate since I don't have all of your files, but you are missing closing tags for:
Missing </li> after the code: <li>What is Ranking Climber?
Missing </div> before the code: </form>

Answer 4

use this css
clear: both;
<div id="container">
<div class="left"></div>
<div class="right"></div>
</div>
<div class="footer"></div>
CSS for these DIV's
#container{
width:950px;
min-height:500px; // This will helps you to stick to footer to bottom about 500px below
}
.left{ width: 50%;}
.right { width:50%;}
.footer{
widht: 950px;
clear: both; // This will helps you to avoid footer to overlap. Use this when Some elements is overlapping
}