css posição fixa não funciona de todo

Question

Dec 21, 2013, 09:50 PM

css posição fixa não funciona de todo

Eu estou olhando para fazer uma coisa do tipo de rodapé parablakehawley.com onde tem alguns links diferentes e tal. É suposto ser um estilo de banner, e com isso quero dizer que é para ficar na parte inferior e ser corrigido. O div é "menu"

Aqui está o meu HTML:

    <html>

<head>
<link rel="stylesheet" media="all and (min-width: 1378px)" href="style/grid-1378.css">
<link rel="stylesheet" media="all and (min-width: 1218px) and (max-width: 1377px)" href="style/grid-1218.css">
<link rel="stylesheet" media="all and (min-width: 978px) and (max-width: 1217px)" href="style/grid-978.css">
<link rel="stylesheet" media="all and (min-width: 748px) and (max-width: 977px)" href="style/grid-748.css">
<link rel="stylesheet" media="all and (min-width: 0px) and (max-width: 747px)" href="style/grid-400.css">

<link href='http://fonts.googleapis.com/css?family=Playfair+Display' rel='stylesheet' type='text/css'>

<title>The Official Site of Blake Hawley</title>

</head>
<body>

<div id="homeimage">
<img src="style/images/blakehome.jpg">
</div>

<div id="name">
Blake Hawley
</div>

<div id="maincontent">

<a class="twitter-timeline" href="https://twitter.com/BlakeHawley5" data-widget-id="414439781083267072">Tweets by @BlakeHawley5</a>
<script>!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");</script>

</div>

<div id="menu">

</div>

</body>
</html>

Aqui está o meu CSS:

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;
}

Qualquer coisa que vocês veem?