Forums

skater102

I am creating a website for my church in my spare time. There is a line gray that is being generated when I load the page from the Server. But when I preview the page locally the line is not generated. You can view the page here: http://northgatechurch.org/newsite/index.html

The Html

<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01//EN\" \"http://www.w3.org/TR/html4/strict.dtd\">

<html>

	<head>
		<meta http-equiv=\"content-type\" content=\"text/html;charset=iso-8859-1\">
		<meta name=\"generator\" content=\"Adobe GoLive 6\">
		<title>2.0</title>
		<link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\">
	</head>

	<body id=\"home\">

<!-- Begin page-wrap--> 

	<div id=\"page-wrap\">
		<div id=\"header\">			
			<ul id=\"menu\">      
			    <li><a class=\"home\" href=\"index.html\">home</a></li>
			    <li><a class=\"about\"href=\"#\">about us</a></li>
			    <li><a class=\"programs\"href=\"#\">programs</a></li>
			    <li><a class=\"kids\" href=\"#\">kids/youth</a></li>
			    <li><a class=\"links\"href=\"#\">links</a></li>
			    <li><a class=\"contact\"href=\"#\">contact</a></li>
			</ul>
		</div>
<!-- Begin main-content-------------------------------------------------------------->
		<div id=\"main-content\">


			<div id=\"left-col\">
				
					<ul id=\"nav\">      
					    <li><a class=\"visitors\" href=\"\">visitors</a></li>
					    <li><a class=\"nga\" href=\"\">nga</a></li>
					    <li><a class=\"gwhs\" href=\"\">gwhs</a></li>
					    <li><a class=\"calendar\" href=\"\">calendar</a></li>
					    <li><a class=\"podcast\" href=\"\">podcast</a></li>
					 </ul>
					
					
					
					
			</div>
		
			<div id=\"right-col\">
				
				
			<div id=\"events\">
				<img alt=\"weekly events\" src=\"images/events.png\">
				<ul id=\"events\">
					<li><a class=\"visitors\" href=\"#\">Tues- Pray Down</a>  <br><h3> 11:00-12:00a</h3></li>
					<br>
					<li><a class=\"visitors\" href=\"#\">Tues - Word Up</a>  <br><h3> 12:00-1:00p</h3></li>
					<br>
					<li><a class=\"visitors\" href=\"#\">Wen - Mid-week Celebration</a>  <br><h3>7:00-8:00p</h3></li>
					<br>
					<li><a class=\"visitors\" href=\"#\">Sun - Deep Walk Study</a>  <br><h3> 9:00-10:15</h3></li>
					<br>					
					<li><a class=\"visitors\" href=\"#\">Sun - Weekly Celebration</a>  <br><h3> 10:30-12:00a</h3></li>
				</ul>
			</div>
				<a id=\"events\" href=\"http://visitor.constantcontact.com/d.jsp?m=1101437635070&p=oi\"  target=\"_blank\"><img src=\"images/email.png\" border=\"0\" alt=\"email signup\"/> </a>

			</div>
	

		</div>
	
	<div class=\"clear\"> </div>	
	
<!--END main-content-------------------------------------------------------------->
	
	<div id=\"footer\">
		<div class=\"floatleft\"> NorthGate Church. <br/> All rights reserved.
		</div>
		
		<div class=\"floatright\">
		<!--social bookmarks-->
		<a href=\"http://feeds.feedburner.com/NorthGateChurch\"><img src=\"images/feedburner.png\" border=\"0\"></a>
		<a href=\"http://www.facebook.com/group.php?gid=46929420766\"><img src=\"images/facebook.png\" border=\"0\"></a>
		</div>
	
	
	</div>
	<!--END footer-->
	</div>
	
		

	</body>

</html>

The CSS

* {
	margin:0;
	padding: 0;
	}
body {
	font-family:ariel;
	background: #221E1F;
	height:100%;
}
.floatleft{
	float:left;
}
.floatright{
	float:right;
}

.clear {clear:both}


h3{
	font-size:small;
	font-style:italic;
}



#center {
	margin:0 auto;
	}

#events{
	padding:0 0 0 20px ;
}
 

#header {
	height: 178px; width: 950px;
	background: url(images/header.jpg) no-repeat;
	}
#page-wrap{
	width: 950px;	
	margin:0 auto;
}
#main-content {
	width: 950px;
	min-height: 530px;
}
#footer{
	background: #333333;
	width: 950px;
	height:65px;
	margin:0px  0 0 0;

}
#left-col{
	width: 675px;
	margin:1px 0 0 0;
	float: left;
	background: url(images/leftcol_bg.jpg) repeat-x #201C19;
	min-height:530px;
}
#right-col{
	padding:43px 0 0 0px;
	width:275px;
	float: right;
	background:  url(images/rightcol_bg.jpg) repeat-x #62804E;
	border-style:none;
	min-height:490px;

	
	
}
	
div#events {
	margin:10px 0px 0px 0px;
	}

	ul#events{
	
		font-family: Helvtica, Gadget, sans-serif;
		list-style:circle;
		list-style-image:url(images/dot.png);
		text-decoration:none;
		padding:0px 0 0 0px;
		margin:0 0 0px 25px;
	
	}
			ul#events li a {
				color:#4B0F11;
				font-size:medium;
				}
				ul#events li :hover{
					color: #000000;
				}
/* menu */
ul#menu {
	list-style: none;
	padding:128px 0 0 330px;
 }
	ul#menu li{
 		display:inline;
 	}
	ul#menu li a{
		text-indent: -9999px;
		display:block;
		height: 51px;
		float:left;
	}
		ul#menu li a.home{
			background: url(images/menu_home.jpg) no-repeat bottom center;
			width:107px;
		}
			ul#menu li a.home:hover ,ul#menu li a.home:active{
				background-position: top center;
			}

		ul#menu li a.about{
			background: url(images/menu_about.jpg) no-repeat bottom center;
			width:95px;
		}
				ul#menu li a.about:hover ,ul#menu li a.about:active{
				background-position: top center;
			}
		ul#menu li a.programs{
			background: url(images/menu_programs.jpg) no-repeat bottom center;
			width:95px;
		}
				ul#menu li a.programs:hover ,ul#menu li a.programs:active{
				background-position: top center;
			}
		ul#menu li a.kids{
			background: url(images/menu_kids.jpg) no-repeat bottom center;
			width:97px;
		}
				ul#menu li a.kids:hover ,ul#menu li a.kids:active{
				background-position: top center;
			}
		ul#menu li a.links{
			background: url(images/menu_links.jpg) no-repeat bottom center;
			width:95px;
		}
				ul#menu li a.links:hover ,ul#menu li a.links:active{
				background-position: top center;
			}
		ul#menu li a.contact{
			background: url(images/menu_contact.jpg) no-repeat bottom center;
			width:129px;
		}
				ul#menu li a.contact:hover ,ul#menu li a.contact:active{
				background-position: top center;
			}
		body#home ul#menu li a.home
		body#home ul#menu li a.about
		body#home ul#menu li a.programs
		body#home ul#menu li a.kids
		body#home ul#menu li a.links
		body#home ul#menu li a.contact {
			background-position: top center;
		}	

/* nav */
ul#nav {
	list-style: none;
	padding:5px 0 0 47px;
 }
	ul#nav li{
 		display:inline;
 	}
	ul#nav li a{
		text-indent: -9999px;
		display:block;
		height: 176px;
		float:left;
	}
		ul#nav li a.visitors{
			background: url(images/nav/nav_visitors.png) no-repeat bottom center;
			width:110px;
		}
			ul#nav li a.visitors:hover ,ul#nav li a.visitors:active{
				background-position: top center;
			}

		ul#nav li a.nga{
			background: url(images/nav/nav_nga.png) no-repeat bottom center;
			width:110px;
		}
				ul#nav li a.nga:hover ,ul#nav li a.nga:active{
				background-position: top center;
			}
		ul#nav li a.gwhs{
			background: url(images/nav/nav_gwhs.png) no-repeat bottom center;
			width:110px;
		}
				ul#nav li a.gwhs:hover ,ul#nav li a.gwhs:active{
				background-position: top center;
			}
		ul#nav li a.calendar{
			background: url(images/nav/nav_calendar.png) no-repeat bottom center;
			width:109px;
		}
				ul#nav li a.calendar:hover ,ul#navli a.calendar:active{
				background-position: top center;
			}
		ul#nav li a.podcast{
			background: url(images/nav/nav_podcast.png) no-repeat bottom center;
			width:111px;
		}
				ul#nav li a.podcast:hover ,ul#nav li a.podcast:active{
				background-position: top center;
			}

Robskiwarrior

Hey dude,

Yea its your bg images... overwrite em for these...

http://www.svgonline.co.uk/northgate/rightcol_bg.jpg

http://www.svgonline.co.uk/northgate/leftcol_bg.jpg

should be fine then :)

skater102

"Robskiwarrior" said:
Hey dude,

Yea its your bg images... overwrite em for these...

http://www.svgonline.co.uk/northgate/rightcol_bg.jpg

http://www.svgonline.co.uk/northgate/leftcol_bg.jpg

should be fine then :)

Nope, unfortunately that did not fix it. Thanks though.

spencer.creasey

Confirmed that the images provide a fix.

Make sure you clear your cache.

ScottMacD

The grey line appears in FF3, IE7, IE6, Opera, Safari (windows),

think it might be your images

Robskiwarrior

yea it really is the images dude, I checked them before I posted :) you can input the image location on firebug too if you want to test it :D

skater102

"Robskiwarrior" said:
yea it really is the images dude, I checked them before I posted :) you can input the image location on firebug too if you want to test it :D

Yep. You were right. After switched the images and then deleted my browsers cache and then refreshed the page, no more line. Thanks a lot. :D

Robskiwarrior

"skater102" said:
[quote="Robskiwarrior"]yea it really is the images dude, I checked them before I posted :) you can input the image location on firebug too if you want to test it :D

Yep. You were right. After switched the images and then deleted my browsers cache and then refreshed the page, no more line. Thanks a lot. :D[/quote]

ah cool, glad you're sorted :)

treehouse : what would you like to learn today?

Forums

Random Line Generated after rendering in browser