I'm not sure why but the image I'm using is displaying a white line at the top. This doesn't happen with other images. I've zoomed in quite a bit on the image to make sure it's not the image itself. I set the box to black just incase the image didn't cover everything. Yet it's still there. This is the site: http://www3.carleton.ca/clubs/sissa/html5/This is what it looks like:
CSS:\[code\]body{ width: 100%; /*always specify this when using flexBox*/ height:100%; display: -webkit-box; display: -moz-box; display: box; text-align:center; -webkit-box-pack:center; /*way of centering the website*/ -moz-box-pack:center; box-pack:center; background:black; background:url('images/bg/bg14.jpg') no-repeat center center fixed; background-position: left top; -webkit-background-size: cover !important; -moz-background-size: cover !important; background-size: cover !important; font-family: Arial, Helvetica, sans-serif; font-size: 13px;}\[/code\]