Hello,
I am coding a new website but I'm getting a sort of double footer thing. I've put the footer in once but it's appearing twice. It's probably a really simple issue to fix but I cannot seem to find the solution.
Here is the HTML:
<!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Transitional//ENS"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CommuniCare :: Home</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="style.css" type="text/css" />
<style type="text/css">
<!--
img { border: none; }
-->
</style>
</head>
<body>
<div id="main">
<div id="marquee">
<marquee onmouseout="this.start();" onmouseover="this.stop();" direction="left" behaviour="scroll">this website is under construction</marquee>
</div>
Test
<br >
<div id="footer">
<p>CommuniCare - Information, Advice, Support | © Copyright CommuniCare - All Rights Reserved</p>
<p>233 Kings Road, Reading, RG1 4LS</p>
<p>Registered Charity Number, 1078694</p>
</div>
</body>
</html>And here's the CSS:
body {
background: #663399;
}
#main {
background-color: #1165BA;
border: 5px solid #FFFBFA;
border-radius: 6px;
color: #BBBBBB;
font-family: sans-serif;
margin: 20px auto 0;
position: relative;
width: 1000px;
}
#marquee {
background-color: #E65A2C;
border: 1px solid #000000;
border-bottom-left-radius: 5px;
border-top-left-radius: 5px;
border-bottom-right-radius: 5px;
border-top-right-radius: 5px;
color: #F0F0F0;
font-size: 14px;
font-weight: 700;
height: 18px;
margin: 0;
margin-top: 5px;
margin-left: 8px;
margin-right: 8px;
padding: 2px 5px;
text-transform: uppercase;
width: 970px;
}
#footer {
background-color: #C9C1C1;
border-top: 10px solid #D6D0D0;
color: #000000;
font-size: 12px;
padding: 5px;
text-align: center;
}
/* special classes */
.clear { clear: both; }I'm afraid there is no LIVE website yet as I'm doing it from my PC. Here is a link to an image of what I am talking about; http://screensnapr.com/v/aUXSz6.jpg
Thanks :)