Log in

View Full Version : Resolved footer image not showing



mlegg
05-26-2011, 06:20 PM
I made a site and the footer image isn't showing up. The site is here (http://portsmouthgreekfestival.com)

The image is in the directory here (http://portsmouthgreekfestival.com/images/footer.png)

CSS

html,body {
padding:0;
margin:0;
height:100%;
background-image:url(images/greekkey2.gif);
background-position:center top; /* this positioning has been modified */
}
#mainPicture {
height:250px;
width:960px;
background-image:url(images/GreekLogo.jpg);
}
#nav1 {
background: transparent url(images/footer.png) repeat-x scroll left top;
height:40px;
margin:0 auto ;
width:960px;
text-align:center;
}


#nav1 ul {
display:table;
margin:0 auto;
padding:0;
list-style-type:none;
position:relative;
height:40px;
text-transform:uppercase;
font-size:13px;
font-family:Arial,sans-serif;
}


#nav1 ul li {
display:block;
float:left;
margin:0;
padding:0;
background:transparent url("images/footer.png") repeat-x top left;

}


#nav1 ul li a {
display:block;
float:left;
color:#ffffff;
text-decoration:none;
padding:0px 20px ;
line-height:40px;
font-weight:bold;
}


#nav1 ul li a:hover {
color:#ffffff;
background:transparent url("images/hmenu-sel.jpg") repeat-x top left;
}
#container {
position:relative;
width:960px;
min-height:100%;
margin:auto;
font-family: sans-serif;color:navy;
background-color:#fff;
}
div.one {
padding: 15px;
min-height:100%;
}
div.one a:link {
color :#00008B;
text-decoration:underline;
}
div.one a:visited {
color: #FF0000;
text-decoration : underline;
}

div.one a:hover {
color: #FFFFFF;
background-color: #8B0000;
text-decoration: underline;
}

div.one a:active {
color : #FF0033;
background-color: #FFFFFF;
text-decoration: underline;
}
h1 {
font-size: 22px;
font-weight: bold;
margin-top: 5px;
margin-bottom: 3px;
}
h2 {
font-size: 18px;
font-weight: bold;
margin-top: 0px;
margin-bottom: 0px;
h3 {
font-size: 14px;
font-weight: bold;
margin-top: 0px;
margin-bottom: 0px;
table a {
font-size:16px;
color:#000066;
text-decoration:underline;
}
table a:hover {
font-size:16px;
color:#fff;
background-color:#8B0000;
}

#footer {
position:absolute;
width:100%;
left:0;
bottom:0;
padding:5px 0;
font-family:sans-serif;
font-size:15px;
color:#ed000b;
text-align:center;
background-image:url(images/footer.png);
}
#footer a:link {
color : #FF0000;
text-decoration:underline;
}

#footer a:visited {
color: #FF0000;
text-decoration : underline;
}

#footer a:hover {
color: #FFFFFF;
background-color: #8B0000;
text-decoration: underline;
}

#footer a:active {
color : #FF0033;
background-color: #FFFFFF;
text-decoration: underline;
}

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta name="generator" content=
"HTML Tidy for Linux/x86 (vers 11 February 2007), see www.w3.org" />
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii" />
<meta name="language" content="english" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta name="google-site-verification" content=
"I4Ask6VXiDmcOHZoEGhMNu7K7mGb4VG28ZHmOGPF7SE" />

<title>Greek Festival Portsmouth</title>
<link rel="stylesheet" type="text/css" href="styles.css" /><!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6styles.css">
<![endif]-->


<style type="text/css">
/*<![CDATA[*/
li.c1 {border:none}
/*]]>*/
</style>
<style type="text/css">

<style type="text/css">
/*<![CDATA[*/
div.c1 {clear:both}
/*]]>*/
</style>





<!-- Start VisualSlideShow.com HEAD section -->
<link rel="stylesheet" type="text/css" href="engine/css/slideshow.css" media="screen" />
<style type="text/css">.slideshow a#vlb{display:none}</style>
<script type="text/javascript" src="engine/js/mootools.js"></script>
<script type="text/javascript" src="engine/js/visualslideshow.js"></script>
<!-- End VisualSlideShow.com HEAD section -->

</head>

<body>
<div id="container">
<div id="mainPicture"></div>
<div id="nav1">
<ul>
<li id="current" class="c1"><a href="index.html">Home</a></li>
<li><a href="involved.html">Get Involved</a></li>
<li><a href="menu.html">Menu</a></li>
<li><a href="events.html">Schedule of Events</a></li>
<li><a href="contact.html">Contact &amp; Directions</a></li>
</ul>
</div>
<div class="one">
<h1 style="text-align:center">Welcome to the St. Nicholas Greek Orthodox Church festival website</h1>
<p style="text-align:center">We are coming on our third decade of bringing the best Greek food, dancing, and culture to Portsmouth, NH. Our festival is JULY 15, 16 &amp; 17 2011 rain or shine! All benefits go to support the St. Nicholas Greek Orthodox Church and surrounding Orthodox community.




<br><strong>Hours:</strong> Friday 5pm - 11pm, Saturday 11am to 11pm, Sunday 1pm to 6pm</p>
<table>
<tr>
<td width="500px">
<strong>2011 Sponsors</strong><br><br>
<a href="http://www.hilltopchevy.com" target="_blank">
<img src="images/HilltopLogo.JPG" width="225" height="123" border="1" alt="Ron Curriers Hilltop Chevrolet" /></a> <a href="http://www.unitedsiteservices.com" target="_blank">
<img src="images/UnitedLogo.JPG" width="225" height="95" border="1" alt="United Site Services" /></a>

</td>


<td width="450px">
<OBJECT ID="MediaPlayer" WIDTH="440" HEIGHT="324" CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"

STANDBY="Loading Windows Media Player components..." TYPE="application/x-oleobject">

<PARAM NAME="FileName" VALUE="GreekFestival.wmv">

<PARAM name="autostart" VALUE="true">

<PARAM name="ShowControls" VALUE="true">

<PARAM name="ShowStatusBar" value="true">

<PARAM name="ShowDisplay" VALUE="false">

<EMBED TYPE="application/x-mplayer2" SRC="media/GreekFestival.wmv" NAME="MediaPlayer"

WIDTH="440" HEIGHT="324" ShowControls="1" ShowStatusBar="1" ShowDisplay="0" autostart="1"> </EMBED>
</OBJECT>
</tr>
</table>

<div style="clear:both;"><br>
<p>Voluntary admission: $3.00 (children under 12 admitted free of charge)</p>
<p><b>Music &amp; Dancing:</b> Live Greek Music by Ellas and orfeas Fri &amp; Sat 6:30pm to 11pm, Sun 1:30pm to 6pm<br>
DJ Meleti, Fri, Sat &amp; Sun</p>
<p><b>Food:</b> Lamb, Gyro, Souvlaki, Pastitsio, Moussaka, Spanakopita &amp; more!<br>
Greek Pastries galore!<br>
Beer & Wine Greek Gifts, Children’s Activities<br>
Voluntary Admission: $3 (children under 12 Free)</p>
<b>Directions:</b> From Portsmouth Rotary, take Rte 1 bypass, then left at 3rd traffic light (Greenleaf Ave). Follow signs to Festival at Andrew Jarvis Drive next to Portsmouth High School. <a href="contact.html">View a map here.</a></p>
<p>Add us on <a href="http://www.facebook.com/event.php?eid=210109069003368" target="_blank">
<img src="images/Facebook.gif" width="120" height="30" border="0" alt="Facebook" />
</a></p><br>
<h3 style="text-align:center">Want to support the Greek Orthodox Community? <a href="https://www.fundraise.com/st-nicholas-greek-orthodox-church" target="_blank">Become a supporter</a> and join our fundraising campaign.</h3>

<div style="clear:both;">
<div class="c1"></div><br>
<div id="footer">
Copyright © PortsmouthGreekFestival.com
</div>
</div><!--end #container -->
</div>
</div></div>

</body>
</html>

coothead
05-26-2011, 06:38 PM
Hi there mlegg,

the problem is caused by missing curly brackets at the end of your "h2" and "h3" rules in your css. :eek:

coothead

mlegg
05-26-2011, 06:56 PM
oops, those were the last 2 lines that I added in
thanks