HTML/CSS Help

Adding the following code to the footer will push it down.

footer{
     position: relative;
     top: 40px;
}

Usually you would use the code shown below to push it down, but this isn't working because you floated the gallery. I would recommend not floating all your elements if you don't need to, for example there is no reason to float the header, this just breaks your site and forces you to use the clear:both; css command throughout your site.

footer{
     margin-top: 40px;
}

Alternatively you could use the following code instead so you can use margin-top.

<div class="gallery">
     <ul>
          <li>Coming Soon</li>
          <li>Coming Soon</li>
          <li>Coming Soon</li>
          <li>Coming Soon</li>
          <li>Coming Soon</li>
          <li>Coming Soon</li>
     </ul>
</div>

.gallery{
     -webkit-columns: 2; /* Chrome, Safari, Opera Support */
     -moz-columns: 2; /* Firefox Support */
     columns: 2;
}
.gallery ul{
     padding: 0;
     list-style: none;
}
.gallery ul li{
     background-color: black;
     width: 100%;
     height: 150px;
     margin: 0 5px 5px;
}

If you check the following link at Can I Use columns you can see that it is supported on all browsers. For future reference Can I Use is a useful tool for checking to see if css is supported on certain browsers and versions.

Also I would recommend using classes rather than id's for styling your tags so you can reuse that class later on if you need to. You might for example use two gallery's on your site.