Hi,
It's been a long time since I've posted on here and it's been a rather long time since I've coded. However, I'm using a footer I used on another site I made however its causing a scrollbar to appear when there really doesn't need to be one. If I put the footer in the container the scrollbar goes.
What am I doing wrong here? Also I don't know why its not across the entire page, it has a small white gap down the left side and then causes the bottom scrollbar to appear. I'm so confused with this, its driving me nuts. The website is "chocants.co.uk".
style.css
html,body,#container {
height:100%;
}
body > #container {
height:auto;
min-height:100%;
}
body {
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
-o-user-select:none;
user-select:none;
}
#content {
padding-bottom:3em;
}
#footer{
postition: absolute;
width: 100%;
height: 250px;
font-size: 12px;
background-color: #d1d1d1;
color: #020027;
padding: 5px 5px 0 5px;
text-align: center;
background-color: #d1d1d1;
}
index.html
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Chocants | Coming Soon!</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="content"></div>
<div style="text-align: center"><img ondragstart="return false"
onmousedown="return false" src="images/ComingSoon.png" /></div>
</div>
<div id="footer">
sdfgjhjkl
</div>
</body>
</html>