harlequin2k5
03-05-2006, 04:46 AM
Once again I know I'm doing something dumb - and Aero had helped me with a similar issue previously, but it doesn't seem to want to work here
this is the page (http://test.stignatiusecc.org/logo-test-index.php) and as you can see in ie and opera the filler fills all the way down through the footer - but in ff it stops just before the >hr<
this is the entire html and css since I'm not sure where the error is
HTML<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="eng-us">
<head>
<title>Using ECC Logo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="css/ecc-logo-style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="main-wrap">
<div id="col-wrap">
<div id="top-nav">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About<br />
Us</a></li>
<li><a href="#">Our<br />
Mission</a></li>
<li><a href="#">Who Was<br />
St. Ignatius?</a></li>
<li><a href="#">Registration</a></li>
<li><a href="#">Class<br />
Rooms</a></li>
<li><a href="#">School<br />
Calendar</a></li>
<li><a href="#">Contact<br />
Us</a></li>
</ul></div><div class="clear"> </div>
<div id="left-col"> </div>
<div id="main-content"><h1>Welcome</h1>
<p>Thank you for your interest in St. Ignatius Early Childhood Center. We
welcome you and your children to our center located in Tarpon Springs,
Florida. We look forward to meeting with you and want to put your mind
at ease with your decision to choose St. Ignatius.</p>
<h1>Our Philosophy</h1>
<p>St. Ignatius ECC is foremost a Catholic school where two, three, four
and five year olds are given opportunities to develop spiritually, physicall,
and intellectually. Each child is a special little human being with individual
needs. St. Ignatius provides the staff, programs and environment to enhance
the growth and development of young children. To accomplish our task,
we are dedicated to the goal of providing developmentally appropriate
programs aimed at total child development.</p>
<h1>Licensing & Accreditation</h1>
<p>St. Ignatius Early Childhood Center is a fully licensed facility under
the Pinellas County License Department and accredited by the prestigious
National Association for the Education of Young Children. St. Ignatius
ECC is also part of the Diocese of St. Petersburg's Office of Catholic
Schools & Centers.</p>
<div id="footer"><hr />
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Mission</a></li>
<li><a href="#">Registration</a></li>
<li><a href="#">Class Rooms</a></li>
<li><a href="#">School Calendar</a></li>
<li><a href="#">Who Was St. Ignatius?</a></li>
<li><a href="#">Contact Us</a></li>
<li><a href="#">St. Ignatius Catholic Church</a></li>
<li><a href="#">Diocese of St. Petersburg</a></li>
<li><a href="#">Guardian Angels</a></li>
<li><a href="#">NAEYC</a></li>
</ul>
</div></div><div class="clear"> </div>
</div>
</div>
</body>
</html>
css/* CSS Document */
body {
background-color:#536994;
text-align: center;
margin: 5px 0px;
}
#main-wrap {
font-family: Arial, Helvetica, sans-serif;
color: #000000;
text-decoration: none;
width: 770px;
min-height:400px;
margin-right: auto;
margin-left: auto;
padding: 0px;
margin-top: 0px;
margin-bottom: 0px;
background-image: url(../images/bclogo-fill.jpg);
background-repeat: repeat-y;
background-color: #FFFFFF;
}
#col-wrap {
background-image: url(../images/bclogo.jpg);
background-repeat: no-repeat;
background-position: left top;
margin: 0px;
padding: 0px;
width: 770px;
min-height:400px;
}
#top-nav {
width: 650px;
padding: 0px;
text-align: right;
color: #000000;
margin: 10px 0px 0px;
float: right;
}
#top-nav ul {
width:650px;
text-decoration: none;
padding: 0px;
list-style-type: none;
margin: 0px auto;
text-align: center;
}
#top-nav li {
display:inline;
padding: 2px 0;
text-align: center;
width: 81px;
margin: 0px auto;
text-decoration: none;
float: left;
}
#top-nav ul li a:link {
display: block;
text-decoration:none;
color: #000000;
margin: 0px;
padding: 0px;
font-size: 10px;
text-align: center;
font-family: "Trebuchet MS";
}
#top-nav ul li a:visited {
display: block;
text-decoration:none;
color: #000000;
margin: 0px;
padding: 0px;
font-size: 10px;
text-align: center;
font-family: "Trebuchet MS";
}
#top-nav ul li a:hover {
display: block;
background-color:#FFB31B;
color:#000000;
text-decoration: none;
margin: 0px;
padding: 0px;
font-size: 10px;
text-align: center;
font-family: "Trebuchet MS";
}
#top-nav ul li a:active {
display: block;
background-color:#FFB31B;
color:#000000;
text-decoration: none;
margin: 0px;
padding: 0px;
font-size: 10px;
text-align: center;
font-family: "Trebuchet MS";
}
#top-nav ul li a:focus {
display: block;
background-color:#536994;
color:#000000;
text-decoration: none;
margin: 0px;
padding: 0px;
font-size: 10px;
text-align: center;
background-image: url(../images/bclogo-texturefill.jpg);
font-family: "Trebuchet MS";
}
#main-content {
width: 640px;
font-family: "Trebuchet MS";
font-size: 10px;
color: #000000;
text-decoration: none;
text-align: justify;
padding: 5px;
float: left;
margin: 80px 0px 0px;
}
#footer{
width:640px;
padding: 0px;
float: left;
margin: 0px;
}
#left-col {
margin: 80px 0px 0px;
padding: 0px;
float: left;
width: 110px;
}
h1 {
font-family: "Trebuchet MS";
font-size: 16px;
font-weight: bold;
color: #536994;
}
#footer ul {
font-family: "Trebuchet MS";
text-align: center;
margin: 0px;
padding: 0px;
width: 640px;
font-size: 10px;
}
#footer li {
display: inline;
margin: 0px;
padding: 0px;
float: left;
width: 150px;
height: 1.2em;
}
#footer li a:link {
text-decoration: none;
color: #536994;
}
#footer li a:visited {
text-decoration: none;
color: #536994;
}
#footer li a:hover {
text-decoration: underline overline;
color: #990000;
}
#footer li a:active {
text-decoration: none;
color: #536994;
}
.clear {
clear:both;
font-size:0;
line-height:0px;
}
I've tried both min-heights and clears and I can't get it to display longer
any help is greatly appreciated
this is the page (http://test.stignatiusecc.org/logo-test-index.php) and as you can see in ie and opera the filler fills all the way down through the footer - but in ff it stops just before the >hr<
this is the entire html and css since I'm not sure where the error is
HTML<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="eng-us">
<head>
<title>Using ECC Logo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="css/ecc-logo-style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="main-wrap">
<div id="col-wrap">
<div id="top-nav">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About<br />
Us</a></li>
<li><a href="#">Our<br />
Mission</a></li>
<li><a href="#">Who Was<br />
St. Ignatius?</a></li>
<li><a href="#">Registration</a></li>
<li><a href="#">Class<br />
Rooms</a></li>
<li><a href="#">School<br />
Calendar</a></li>
<li><a href="#">Contact<br />
Us</a></li>
</ul></div><div class="clear"> </div>
<div id="left-col"> </div>
<div id="main-content"><h1>Welcome</h1>
<p>Thank you for your interest in St. Ignatius Early Childhood Center. We
welcome you and your children to our center located in Tarpon Springs,
Florida. We look forward to meeting with you and want to put your mind
at ease with your decision to choose St. Ignatius.</p>
<h1>Our Philosophy</h1>
<p>St. Ignatius ECC is foremost a Catholic school where two, three, four
and five year olds are given opportunities to develop spiritually, physicall,
and intellectually. Each child is a special little human being with individual
needs. St. Ignatius provides the staff, programs and environment to enhance
the growth and development of young children. To accomplish our task,
we are dedicated to the goal of providing developmentally appropriate
programs aimed at total child development.</p>
<h1>Licensing & Accreditation</h1>
<p>St. Ignatius Early Childhood Center is a fully licensed facility under
the Pinellas County License Department and accredited by the prestigious
National Association for the Education of Young Children. St. Ignatius
ECC is also part of the Diocese of St. Petersburg's Office of Catholic
Schools & Centers.</p>
<div id="footer"><hr />
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Mission</a></li>
<li><a href="#">Registration</a></li>
<li><a href="#">Class Rooms</a></li>
<li><a href="#">School Calendar</a></li>
<li><a href="#">Who Was St. Ignatius?</a></li>
<li><a href="#">Contact Us</a></li>
<li><a href="#">St. Ignatius Catholic Church</a></li>
<li><a href="#">Diocese of St. Petersburg</a></li>
<li><a href="#">Guardian Angels</a></li>
<li><a href="#">NAEYC</a></li>
</ul>
</div></div><div class="clear"> </div>
</div>
</div>
</body>
</html>
css/* CSS Document */
body {
background-color:#536994;
text-align: center;
margin: 5px 0px;
}
#main-wrap {
font-family: Arial, Helvetica, sans-serif;
color: #000000;
text-decoration: none;
width: 770px;
min-height:400px;
margin-right: auto;
margin-left: auto;
padding: 0px;
margin-top: 0px;
margin-bottom: 0px;
background-image: url(../images/bclogo-fill.jpg);
background-repeat: repeat-y;
background-color: #FFFFFF;
}
#col-wrap {
background-image: url(../images/bclogo.jpg);
background-repeat: no-repeat;
background-position: left top;
margin: 0px;
padding: 0px;
width: 770px;
min-height:400px;
}
#top-nav {
width: 650px;
padding: 0px;
text-align: right;
color: #000000;
margin: 10px 0px 0px;
float: right;
}
#top-nav ul {
width:650px;
text-decoration: none;
padding: 0px;
list-style-type: none;
margin: 0px auto;
text-align: center;
}
#top-nav li {
display:inline;
padding: 2px 0;
text-align: center;
width: 81px;
margin: 0px auto;
text-decoration: none;
float: left;
}
#top-nav ul li a:link {
display: block;
text-decoration:none;
color: #000000;
margin: 0px;
padding: 0px;
font-size: 10px;
text-align: center;
font-family: "Trebuchet MS";
}
#top-nav ul li a:visited {
display: block;
text-decoration:none;
color: #000000;
margin: 0px;
padding: 0px;
font-size: 10px;
text-align: center;
font-family: "Trebuchet MS";
}
#top-nav ul li a:hover {
display: block;
background-color:#FFB31B;
color:#000000;
text-decoration: none;
margin: 0px;
padding: 0px;
font-size: 10px;
text-align: center;
font-family: "Trebuchet MS";
}
#top-nav ul li a:active {
display: block;
background-color:#FFB31B;
color:#000000;
text-decoration: none;
margin: 0px;
padding: 0px;
font-size: 10px;
text-align: center;
font-family: "Trebuchet MS";
}
#top-nav ul li a:focus {
display: block;
background-color:#536994;
color:#000000;
text-decoration: none;
margin: 0px;
padding: 0px;
font-size: 10px;
text-align: center;
background-image: url(../images/bclogo-texturefill.jpg);
font-family: "Trebuchet MS";
}
#main-content {
width: 640px;
font-family: "Trebuchet MS";
font-size: 10px;
color: #000000;
text-decoration: none;
text-align: justify;
padding: 5px;
float: left;
margin: 80px 0px 0px;
}
#footer{
width:640px;
padding: 0px;
float: left;
margin: 0px;
}
#left-col {
margin: 80px 0px 0px;
padding: 0px;
float: left;
width: 110px;
}
h1 {
font-family: "Trebuchet MS";
font-size: 16px;
font-weight: bold;
color: #536994;
}
#footer ul {
font-family: "Trebuchet MS";
text-align: center;
margin: 0px;
padding: 0px;
width: 640px;
font-size: 10px;
}
#footer li {
display: inline;
margin: 0px;
padding: 0px;
float: left;
width: 150px;
height: 1.2em;
}
#footer li a:link {
text-decoration: none;
color: #536994;
}
#footer li a:visited {
text-decoration: none;
color: #536994;
}
#footer li a:hover {
text-decoration: underline overline;
color: #990000;
}
#footer li a:active {
text-decoration: none;
color: #536994;
}
.clear {
clear:both;
font-size:0;
line-height:0px;
}
I've tried both min-heights and clears and I can't get it to display longer
any help is greatly appreciated