title: css position fixed not working at all
body: <p>I am looking to make a footer type thing for <a href="http://www.blakehawley.com" rel="nofollow">blakehawley.com</a> where it has some different links and such. It is supposed to be a banner style, and by that I mean it is supposed to stay at the bottom and be fixed. The div is "menu"</p>
  
  <p>Here is my HTML:</p>
  
  <pre><code>    &lt;html&gt;
  
  &lt;head&gt;
  &lt;link rel="stylesheet" media="all and (min-width: 1378px)" href="style/grid-1378.css"&gt;
  &lt;link rel="stylesheet" media="all and (min-width: 1218px) and (max-width: 1377px)" href="style/grid-1218.css"&gt;
  &lt;link rel="stylesheet" media="all and (min-width: 978px) and (max-width: 1217px)" href="style/grid-978.css"&gt;
  &lt;link rel="stylesheet" media="all and (min-width: 748px) and (max-width: 977px)" href="style/grid-748.css"&gt;
  &lt;link rel="stylesheet" media="all and (min-width: 0px) and (max-width: 747px)" href="style/grid-400.css"&gt;
  
  &lt;link href='http://fonts.googleapis.com/css?family=Playfair+Display' rel='stylesheet' type='text/css'&gt;
  
  &lt;title&gt;The Official Site of Blake Hawley&lt;/title&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;div id="homeimage"&gt;
  &lt;img src="style/images/blakehome.jpg"&gt;
  &lt;/div&gt;
  
  &lt;div id="name"&gt;
  Blake Hawley
  &lt;/div&gt;
  
  &lt;div id="maincontent"&gt;
  
  &lt;a class="twitter-timeline" href="https://twitter.com/BlakeHawley5" data-widget-id="414439781083267072"&gt;Tweets by @BlakeHawley5&lt;/a&gt;
  &lt;script&gt;!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");&lt;/script&gt;
  
  &lt;/div&gt;
  
  &lt;div id="menu"&gt;
  
  &lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Here is my CSS:</p>
  
  <pre><code>body{
  margin:0 auto;
  }
  
  #homeimage{
  margin:0 auto;
  margin-top:20px;
  width:720px;
  height:480px;
  box-shadow:5px 5px 5px #888888;
  }
  
  #name{
  text-align:center;
  font-family:'Playfair Display', serif;
  font-size:130px;
  }
  
  #maincontent{
  margin-bottom:20px;
  }
  
  #menu{
  position:fixed;
  float:bottom;
  height:200px;
  width:1218px;
  border:3px solid green;
  box-shadow:0px -5px 5px #888888;
  }
  
  li{
  list-style:none;
  }
  </code></pre>
  
  <p>Anything that you guys see?</p>