HTML перемещает фазер в контейнер div

В настоящее время создаю браузерную игру в phaser и пытаюсь добавить ее в тег div контейнера I 'Мы создали, однако, Phaser, кажется, подталкивает себя ниже контейнера div.

http://gyazo.com/3cc9b9333cf89d7fc879bd2cdc741609 (Это контейнерный div с моим заголовочным div в настоящее время внутри него, что я и хочу сделать в моей фазерной игре)

http://gyazo.com/5a7cea7514a9e295355c87933c3d14ac (Это то, что моя игра Phaser в настоящее время делает над div нижнего колонтитула, вы можете видеть div контейнера, а также ясно видеть игру phaser, в настоящее время находящегося под div нижнего колонтитула)

Это код для моей HTML-страницы:




This is our menu bar!









<a href="file:///H:/AINT103/xampp/htdocs/Weekfour/index.html" class="highlight"><span>Home</span></a>  
<a href="file:///H:/AINT103/xampp/htdocs/Weekfour/index.html"><span>Link1</span></a>   
<a href="file:///H:/AINT103/xampp/htdocs/Weekfour/index.html"><span>Link2</span></a>   
<a href="file:///H:/AINT103/xampp/htdocs/Weekfour/index.html"><span>Link3</span></a>   
<a href="file:///H:/AINT103/xampp/htdocs/Weekfour/index.html"><span>Link4</span></a>   
   









Title of game & small talk about about with some a box surrounding this text before another text box surrounding the game below




Instructions



 Copyright 2013 marc







И это код для моего CSS

body {
font-family: Century Gothic, Arial;
background-color: #CCCCCC;
margin: 0px auto;
text-align: center;
}
.container {
background-color: #999999;
margin: auto;
width: 1000px;
height: 1000px;

}
.header {
font-size: 22px;
background-color: #999999;
border: 1px dashed #666666;
color: #444444;
width: 800px;
font-size: 14px;
text-align: center;
margin: 10px auto 0px auto;
}   
#menu {
float: center;
padding: 0px 10px;
margin: 10px;
border-bottom: 5px solid #6D7AB2;
}

#menu li {
display: inline;
list-style: none;
margin: 0px;
padding: 0px;
}

#menu li a {
float: center;
color: #000000;
text-decoration: none;
background: url('menuleft.gif') top left no-repeat;
margin: 0px 0px;
padding: 9px 0px 0px 9px;
}

#menu li a span {
background: url('menuright.gif') top right no-repeat;
padding: 9px 25px 6px 15px;
}

#menu li a:hover, 
#menu li a.highlight {
background: url('menuleft-hl.gif') top left no-repeat;
color: #ffffff;
}

#menu li a:hover span, 
#menu li a.highlight span {
background: url('menuright-hl.gif') top right no-repeat;
}


canvas {
padding: 0px;
margin: auto;
}

#footer {
clear:both;
margin-top: 10px;
border-top: 5px solid #6D7AB2;
padding: 20px 0px;
font-size: 80%;
text-align:center;


}

Любой, кто сможет помочь показать мне, где яя иду не так?

Ответы на вопрос(3)

Ваш ответ на вопрос