title: My content won't push the footer down
body: <p>It seems I have a problem with my footer. My Content div won't push the footer down. It just go through it. I have been searching the net for days now (even stackoverflow), but I can't seem to find a solution. If anyone can help me, I would really appreciate it. I have tryed to clean up the html, so it would be easier to help me, however, If you like the original code, go to <a href="http://djstarkick.com/where-we-belong" rel="nofollow">http://djstarkick.com/where-we-belong</a>. (You will also see the problem with the footer. </p>
  
  <p>HTML code:</p>
  
  <pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;
  &lt;title&gt;StarKick&lt;/title&gt;
  &lt;link href="style.css" rel="stylesheet" type="text/css"&gt;
  &lt;link href="&lt;?php bloginfo('stylesheet_url'); ?&gt;" rel="stylesheet" type="text/css"&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div class="background"&gt;
    &lt;div class="Container"&gt;
      &lt;div class="Header"&gt;
        &lt;div class="Slideshow"&gt;
  
          &lt;div class="TopLine"&gt;&lt;/div&gt;&lt;!--TopLine--&gt;
  
          &lt;div class="NewMusic"&gt;       
  
          &lt;div class="NewMusicText"&gt;&lt;/div&gt;&lt;!--NewMusicText--&gt;
          &lt;/div&gt;&lt;!--NewMusic--&gt;
  
          &lt;div class="WhereWeBelongPodcast"&gt;       
  
          &lt;div class="WhereWeBelongPodcastText"&gt;&lt;/div&gt;&lt;!--WhereWeBelongPodcastText--&gt;
          &lt;/div&gt;&lt;!--WhereWeBelongPodcast--&gt;
  
  &lt;div class="Meny"&gt;
    &lt;/div&gt;
  &lt;/div&gt;&lt;!-- Meny--&gt;
  
  
  
        &lt;/div&gt;&lt;!--Slideshow--&gt;
  
        &lt;div class="HeaderLine"&gt;&lt;/div&gt;&lt;!--HeaderLine--&gt;
            &lt;div class="Logo"&gt;&lt;/div&gt;&lt;!--Logo--&gt;
  
  
      &lt;/div&gt;&lt;!--Header--&gt;
      &lt;div class="MainContent"&gt;
  
  
      &lt;div class="TwitterPost"&gt;
        &lt;div class="TwitterFeed"&gt;
    &lt;/div&gt;&lt;!--TwitterFeed--&gt;
      &lt;/div&gt;&lt;!--TwitterPost--&gt;
  
      &lt;div class="Content"&gt;
            &lt;div class="contentbackground"&gt;
  
  
            &lt;?php if (have_posts()) : while (have_posts()) : the_post(); ?&gt;
          &lt;hi&gt;&lt;?php the_title(); ?&gt;&lt;/h1&gt;
          &lt;?php the_content(); ?&gt;
      &lt;?php endwhile; endif; ?&gt; &lt;!--Wordpress--&gt;
  
  
            &lt;/div&gt;&lt;!--Contentbackground--&gt;
      &lt;/div&gt;&lt;!--Contentline--&gt;
      &lt;/div&gt;&lt;!--Content--&gt; 
      &lt;/div&gt;&lt;!--MainContent--&gt;
  
  
  
      &lt;div class="Footer"&gt;&lt;/div&gt;&lt;!--Footer--&gt;  
  
    &lt;/div&gt;&lt;!--Container--&gt;
  
  &lt;/div&gt;&lt;!--Background--&gt;
  &lt;/body&gt;
  &lt;/html&gt;&lt;!-- --&gt;
  </code></pre>
  
  <p>CSS code:</p>
  
  <pre><code>/*
  Theme Name: StarKick - Where We Belong
  Theme URI: djstarkick.com
  Author: Dani Møllerplass
  Author URI: djstarkick.com
  Description: My first theme on wordpress for my own use. 
  Version: 1.0
  */
  
  @charset "utf-8";
  body {
      margin: 0;
      padding: 0;
      background-color:#000
  
  }
  .background {
      height: 1080px;
      width: 1920px;
      background-image: url(Pictures/Background/background.png);
      background-repeat: no-repeat;
      position: relative;
      top: 0px;
  }
  .Container {
      width: 980px;
      margin-right: auto;
      margin-left: auto;
      position: relative;
      top: 0px;
  }
  .Header {
      height: 560px;
      width: 980px;
      position: relative;
  }
  .HeaderLine {
      height: 45px;
      width: 980px;
  }
  .Share {
      height: 55px;
      width: 265px;
      position: absolute;
      top: 5px;
      left: 345.5px;
  }
  .Logo {
      height: 182px;
      width: 408px;
      margin-right: auto;
      margin-left: auto;
      position: absolute;
      bottom: 25px;
      left: 291px;
  }
  .Meny {
      height: 50px;
      width: 545px;
      position: absolute;
      top: 150px;
      left: 217.5px;
  }
  .MenyText {
      height: 50px;
      width: 545px;
      position: absolute;
      top: 7.5px;
  }
  .MainContent {
      width: 980px;
      position: relative;
      height: auto;
  }
  
  .Content {
      width: 625px;
      height: auto;
      left: 0px;
      top: 0px;
      float: left;
  }
  .Contentline {
      height: 45px;
      width: 625px;
      top: 0px;
  }
  .contentbackground {
      width: 625px;
      background-repeat: repeat-y;
      border-right-width: 1px;
      border-bottom-width: 1px;
      border-left-width: 1px;
      border-right-style: solid;
      border-bottom-style: solid;
      border-left-style: solid;
      border-top-color: #FFF;
      border-right-color: #FFF;
      border-bottom-color: #FFF;
      border-left-color: #FFF;
      left: 0px;
      background-color: #000;
      position: relative;
  }
  
  .Footer {
      height: 150px;
      width: 980px;
      font-family: "high Tower Text";
      color: #FFF;
      text-align: center;
      position: relative;
      clear: both;
  }
  
  
  .TwitterPost {
      height: 650px;
      width: 325px;
      right: 0px;
      float: right;
  }
  
  .TwitterFeed {
      height: 600px;
      width: 323px;
      position: absolute;
      top: 29px;
      right: 1px;
  }
  
  
  
  .Slideshow {
      height: 450px;
      width: 980px;
      position: relative;
  }
  .NewMusic {
      height: 53px;
      width: 332px;
      position: absolute;
      left: 0px;
      bottom: 0px;
  }
  .NewMusicText {
      height: 53px;
      width: 300px;
      position: absolute;
      left: -5px;
      bottom: 3px;
  }
  .TopLine {
      height: 397px;
      width: 980px;
      position: absolute;
      top: 0px;
  }
  .WhereWeBelongPodcast {
      height: 53px;
      width: 332px;
      position: absolute;
      right: 0px;
      bottom: 0px;
  }
  .WhereWeBelongPodcastText {
      height: 53px;
      width: 300px;
      position: absolute;
      right: -15px;
      bottom: 0px;
  }
  
  
  a:link { 
      color: #FFF;
      text-decoration: none;
      }
  a:visited { 
      color: #FFF;
      text-decoration: none;
      }
  a:hover { 
      color: #CCC;
      text-decoration: none;
      }
  a:active {
      color: #FFF;
      text-decoration: none;
      font-family: "high Tower Text";
      text-align: center;
      }
  
  .background .Container .Header .Slideshow .Meny .MenyText table tr td {
      color: #FFF;
      font-family: "high Tower Text";
      text-align: center;
  }
  .year {
      font-size: 22px;
  }
  </code></pre>
  
  <p>Thanks in advance! :)</p>