I can't seem to get my html button tag to work?

To cut a long story short I'm trying to make a green bar move upwards over a blue bar when a button is clicked (although I haven't added any JS yet. For some reason no matter what I try my button will not work. I have tried the button tag and the input tag to make the button and it makes no difference. My code currently stands at this:


body {
margin: 0;
padding: 0;
text-align: center;
}
#container{
z-index: -1;
position: relative;
background-color: brown;
height: 800px;
width: 800px;
margin: 0 auto;
margin-top: 75px;
}
#fullLoad{
z-index: 1;
position: relative;
height: 600px;
width: 200px;
background: blue;
left: 300px;
top: 100px;
overflow: hidden;
border-radius: 20px 20px 20px 20px;
}
#loader{
border-radius: 20px 20px 20px 20px;
z-index: 2;
position: absolute;
height: 600px;
width: 200px;
background: green;
top: 600px;


}
#btn{
position: absolute;
top: 20px;
right: 362px;
padding: 5px 20px;
border-radius: 5px;
background: gold;
font-family: sans-serif;
font-size: 1.8em;
color: #424242;

}

<div id="container">

<div id="fullLoad">

<div id="loader"></div>

</div>

<input id="btn" type="button" value="Go !" onclick="alert('Hello')">

</div>

Login To add answer/comment