mlegg
01-28-2010, 01:35 AM
I just redesigned our non-profit website and have a problem. Right below my banner, there is a small space and then it appears the banner top is showing again above my text container. I was about to put a horizontal navigation bar below the banner and after doing this realized I had an error somewhere. How can I fix this? Thanks in advance.
EDIT: here is the site http://ahepa215.org/
http://i47.tinypic.com/20upcb9.png
What did I do wrong? Here is my css file
body {
margin: auto;
background-image : url(images/greekkey.gif);
background-repeat : repeat;
max-width : 870px;
}
#mainPicture {
height : 170px;
width : 870px;
background-image : url(images/banner.png);
padding-top: 10px;
margin: 0;
}
.contentBox {
font-family: sans-serif;color:navy;
clear:both;
}
.innerBox {
background-color : #ffffff;
background-image : url(images/content_back.png);
background-repeat : repeat-y;
padding-top: 1em;
padding-left: 1em;
padding-right: 1em;
padding-bottom : 1em;
}
#footer {
background : url(images/footer.png) no-repeat;
text-align : center;
font-size : small;
font-family : sans-serif;
color : #010101;
padding-top: 5px;
padding-bottom: 5px;
}
#footer A {
color : #010101;
}
here is the HTML
<!DOCTYPE HTML>
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>AHEPA 215</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<base href="http://ahepa215.org"></head><body>
<div id="mainPicture"></div>
<div class="contentBox">
<div class="innerBox">
<div class="contentText">
<p>The Portsmouth Chapter #215 of the Order of AHEPA was founded on March 21, 1929, at which time the first meeting was held. On March 24, 1929 thirty four residents of Portsmouth and Dover were initiated into the Order.</p>
<p>In November of 2004, the Portsmouth Chapter was formally incorporated in the State of New Hampshire. The new corporate name is Portsmouth AHEPA 215, which is non-for-profit corporation under IRS Section 501(c)(10).</p>
<p>The chapters undertakings over the years have ranged from building floats for the annual Greek Indepedence Day parade in Boston to increasing financial support through out the Portsmouth area and the Metropolis of Boston.</p>
<p>The AHEPA 215 started its annual golf outing in 1999 to enable to start funding its Scholarship Fund. This Scholarship Fund provides annual scholarships to Greater Portsmouth graduating High School Seniors whom have met three requirements, excellent grades, community service (at St Nicholas Greek Orthodox Church and within the community) and financial need.</p>
<p>In 2008, through its fund raising efforts the chapter was able to create a new Charitable Endowment Fund, the income from this fund will be used to assist those in need throughout the Greater Portsmouth Area.</p>
<p>The AHEPA 215 has 42 active members and is growing. You do not have to be Greek or an Orthodox Christian to join AHEPA, but you must believe in our mission and the promotion of Hellenism.</p>
</div>
</div>
</div>
</div>
<div id="footer">Copyright © AHEPA 215</a> | <a href="mailto:ahepa215@gmail.com.com">E-Mail</a></div>
</body></html>
EDIT: here is the site http://ahepa215.org/
http://i47.tinypic.com/20upcb9.png
What did I do wrong? Here is my css file
body {
margin: auto;
background-image : url(images/greekkey.gif);
background-repeat : repeat;
max-width : 870px;
}
#mainPicture {
height : 170px;
width : 870px;
background-image : url(images/banner.png);
padding-top: 10px;
margin: 0;
}
.contentBox {
font-family: sans-serif;color:navy;
clear:both;
}
.innerBox {
background-color : #ffffff;
background-image : url(images/content_back.png);
background-repeat : repeat-y;
padding-top: 1em;
padding-left: 1em;
padding-right: 1em;
padding-bottom : 1em;
}
#footer {
background : url(images/footer.png) no-repeat;
text-align : center;
font-size : small;
font-family : sans-serif;
color : #010101;
padding-top: 5px;
padding-bottom: 5px;
}
#footer A {
color : #010101;
}
here is the HTML
<!DOCTYPE HTML>
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>AHEPA 215</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<base href="http://ahepa215.org"></head><body>
<div id="mainPicture"></div>
<div class="contentBox">
<div class="innerBox">
<div class="contentText">
<p>The Portsmouth Chapter #215 of the Order of AHEPA was founded on March 21, 1929, at which time the first meeting was held. On March 24, 1929 thirty four residents of Portsmouth and Dover were initiated into the Order.</p>
<p>In November of 2004, the Portsmouth Chapter was formally incorporated in the State of New Hampshire. The new corporate name is Portsmouth AHEPA 215, which is non-for-profit corporation under IRS Section 501(c)(10).</p>
<p>The chapters undertakings over the years have ranged from building floats for the annual Greek Indepedence Day parade in Boston to increasing financial support through out the Portsmouth area and the Metropolis of Boston.</p>
<p>The AHEPA 215 started its annual golf outing in 1999 to enable to start funding its Scholarship Fund. This Scholarship Fund provides annual scholarships to Greater Portsmouth graduating High School Seniors whom have met three requirements, excellent grades, community service (at St Nicholas Greek Orthodox Church and within the community) and financial need.</p>
<p>In 2008, through its fund raising efforts the chapter was able to create a new Charitable Endowment Fund, the income from this fund will be used to assist those in need throughout the Greater Portsmouth Area.</p>
<p>The AHEPA 215 has 42 active members and is growing. You do not have to be Greek or an Orthodox Christian to join AHEPA, but you must believe in our mission and the promotion of Hellenism.</p>
</div>
</div>
</div>
</div>
<div id="footer">Copyright © AHEPA 215</a> | <a href="mailto:ahepa215@gmail.com.com">E-Mail</a></div>
</body></html>