Не знаю почему но когда чуть изменю что нибудь в коде то футер вниз уходит.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Клуб CASPER</title>
</head>
<link href="css/style.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/javascript.js"></script>
<link rel="stylesheet" media="only screen and (max-width:800px)" href="css/800.css" />
<link rel="stylesheet" media="only screen and (max-width:800px)" href="css/600.css" />
<link rel="SHORTCUT ICON" href="img/favicon.ico"type="image/x-icon">
<body>
<center><div class="head">
<img src="img/head1.png" id="shapka" alt="Картинка" />
</div></center>
<center><div id='cssmenu'>
<center><ul id="menu_wrap" class="Blue"><li class="button"><a href="index.html">Главная</a></li><li id="mapbutton" class="button"><a href="#m">Где мы находимся</a></li><li class="button"><a href="3">Список услуг</a></li><li class="button"><a href="4">Чемп‹</a></li> </ul></center>
</div></center>
<center><img src="img/mid.jpg" id="mid" alt="center" /></center>
<div><!--Панель меню!-->
<img src="img/panel1.jpg" id="p1" alt=" " />
<img src="img/panel2.jpg" id="p2" alt=" " />
<img src="img/panel3.jpg" id="p3" alt=" " />
<img src="img/panel4.jpg" id="p4" alt=" " />
<img src="img/panel5.jpg" id="p5" alt=" " />
</div>
<div id="maps">
<center><iframe src="https://mapsengine.google.com/map/embed?mid=zY4eWZBBjhUU.kWHOvOBTGjNY" width="937" height="450"></iframe></center>
</div>
<center><img src="img/footer.jpg" id="footer" alt="footer" /></center>
<script type="text/javascript">
</script>
</body>
</html>
body{
background-color: #7094FF;
}
.head{
width: 938px;
height: 119px;
margin: 10px;
overflow: hidden;
-webkit-border-radius: 10px 10px 5px 0;
-moz-border-radius: 10px 10px 5px 0;
border-radius: 10px 10px 5px 0;
-webkit-box-shadow: 0px 0px 8px 0px rgba(50, 50, 50, 0.9);
-moz-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);
box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);
}
#mid{
width: 939px;
height: 970px;
margin: -17px;
overflow: hidden;
}
#footer{
width: 939px;
height: 100px;
margin: -90px;
overflow: hidden;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 8px;
-webkit-box-shadow: 0px 0px 8px 0px rgba(50, 50, 50, 0.9);
-moz-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);
box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);
}
#menu_wrap{position:relative;margin-top:-10px;margin-left:auto;margin-right:auto;padding:0; padding-right:0px;width:938px;height:43px;list-style-type:none;-webkit-border-radius:0px;-moz-border-radius:0px;border-radius:0px;-webkit-box-shadow:0 1px 3px rgba(0,0,0,.2);-moz-box-shadow:0 1px 3px rgba(0,0,0,.2);box-shadow:0 1px 3px rgba(0,0,0,.2)}.button a{cursor:pointer;text-align:center;font:13px/100% Arial, Helvetica, sans-serif;font-weight:bold;position:relative;min-width:50px;height:20px;float:left;padding:10px;padding-top:11.5px;padding-bottom:11.5px;text-decoration:none;text-shadow:0 1px 1px rgba(0,0,0,.3)}.button:first-child a{-webkit-border-top-left-radius:0px;-webkit-border-bottom-left-radius:0px;-moz-border-topleft-radius:0px;-moz-border-bottomleft-radius:0px;border-top-left-radius:0;border-bottom-left-radius:0px}.Blue,.Blue .button a{color:#d9eef7;background: #00adee;border-right:solid 1px #0078a5;background: -moz-linear-gradient(top, #00adee 0%, #0078a5 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00adee), color-stop(100%,#0078a5));background: -webkit-linear-gradient(top, #00adee 0%,#0078a5 100%);background: -o-linear-gradient(top, #00adee 0%,#0078a5 100%);background: -ms-linear-gradient(top, #00adee 0%,#0078a5 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00adee', endColorstr='#0078a5',GradientType=0 );background: linear-gradient(top, #00adee 0%,#0078a5 100%);}.Blue .button a:hover,.Blue .button a:focus{background: #0095cc;background: -moz-linear-gradient(top, #0095cc 0%, #00678e 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0095cc), color-stop(100%,#00678e));background: -webkit-linear-gradient(top, #0095cc 0%,#00678e 100%);background: -o-linear-gradient(top, #0095cc 0%,#00678e 100%);background: -ms-linear-gradient(top, #0095cc 0%,#00678e 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0095cc', endColorstr='#00678e',GradientType=0 );background: linear-gradient(top, #0095cc 0%,#00678e 100%);}.Blue .button a:active{background: #0078a5;background: -moz-linear-gradient(top, #0078a5 0%, #00adee 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0078a5), color-stop(100%,#00adee));background: -webkit-linear-gradient(top, #0078a5 0%,#00adee 100%);background: -o-linear-gradient(top, #0078a5 0%,#00adee 100%);background: -ms-linear-gradient(top, #0078a5 0%,#00adee 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0078a5', endColorstr='#00adee',GradientType=0 );background: linear-gradient(top, #0078a5 0%,#00adee 100%);}.button:last-child a{float:left;border:none; -webkit-border-top-right-radius:0px;-webkit-border-bottom-right-radius:0px;-moz-border-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px}
#p1{
position:relative;
top: -920px;
left: 186px;
}
#p2{
position:relative;
top: -920px;
left: 205px;
}
#p3{
position:relative;
top: -920px;
left: 225px;
}
#p4{
position:relative;
top: -920px;
left: 242px;
}
#p5{
position:relative;
top: -920px;
left: 262px;
}
#p-mid1{
background-color: #ffffff;
border: 2px solid #999999;
-moz-border-radius: 22px;
-webkit-border-radius: 22px;
border-radius: 22px;
-moz-box-shadow: 0px 0px 5px #000000;
-webkit-box-shadow: 0px 0px 5px #000000;
box-shadow: 0px 0px 5px #000000;
opacity: 0.35;
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 35);
filter: alpha(opacity = 35);
}
#block{
color: red;
position: relative;
top: -910px;
left: 262px;
}
#maps{
top: -472px;
position:relative;
opacity: 0.80;
}
Простой
