I am using this gallery script on a site I am working with and for some reason can not seem to get the Back to Menu ( link ) at the bottom of the code to be at the bottom of the page or at least under the images that propegate above it - any help

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	
	<title>Bridal Gallery</title>
	
	<link rel="stylesheet" type="text/css" href="style.css" />
	<link rel="stylesheet" type="text/css" href="resources/fancy.css" />
	
	<script type="text/javascript" src="js/jquery-1.2.3.pack.js"></script>
	<script type="text/javascript" src="js/jquery.fancybox-1.0.0.js"></script>
	
	<script type="text/javascript">
	
		$(function(){
		
			$(".photo-link").fancybox({ 'zoomSpeedIn': 500, 'zoomSpeedOut': 500, 'overlayShow': true }); 
		
		});
	
	</script>

<style>.break { page-break-before: always; }</style>

</head>

<body>

	<div id="page-wrap">
	
	<img src="resources/header.png" alt="Photo Gallery" /><br />

	<a class="photo-link" rel="one-big-group" href="../../category/bridal/IMG_0813.jpg"><img src="../../category/bridal/IMG_0813-thumb.jpg" width="100" height="100" /></a><a class="photo-link" rel="one-big-group" href="../../category/bridal/IMG_083.jpg"><img src="../../category/bridal/IMG_083-thumb.jpg" width="100" height="100" /></a><a class="photo-link" rel="one-big-group" href="../../category/bridal/IMG_08.jpg"><img src="../../category/bridal/IMG_08-thumb.jpg" width="100" height="100" /></a><a class="photo-link" rel="one-big-group" href="../../category/bridal/IMG_8.jpg"><img src="../../category/bridal/IMG_8-thumb.jpg" width="100" height="100" /></a><a class="photo-link" rel="one-big-group" href="../../category/bridal/IMG_8123.jpg"><img src="../../category/bridal/IMG_8123-thumb.jpg" width="100" height="100" /></a><a class="photo-link" rel="one-big-group" href="../../category/bridal/IMG_812.jpg"><img src="../../category/bridal/IMG_812-thumb.jpg" width="100" height="100" /></a><div class="clear"></div><a class="photo-link" rel="one-big-group" href="../../category/bridal/IMG_81.jpg"><img src="../../category/bridal/IMG_81-thumb.jpg" width="100" height="100" /></a>	
	</div>

<center><font color="white" size=5><a href="../index.html" border=0>Back To Menu</a></font></center>

</body>

</html>

<font color="white"> , which color is the background?

The background is Grey but its not the font color that is stopping it its the coding that is somehow doing so it shows up but to the side of the photos for some reason instead of under them

here is what I am talking about ... anyone ?

http://www.marcheseditalia.com/gallery/bridal/

Remove center and font tag and write:

<a style="display: block; width: 100px; height: 30px; margin: 20px auto; color: white" href="../index.html" border=0>Back To Menu</a>

Otherwise use a div:

<div style="width: 800px; margin: 20px auto; text-align:center;">
<a style="color:left;" href="../index.html" border=0>Back To Menu</a>
</div>

You can use also float to do this.

Or before <center><font color="white" size=5>, add this line.

<br style="clear: both;">

vibhadevit & cereal thank you both as both your ideas worked ... only question I have now is that even tho I have it telling the webpage to make the font white seems like when I have clicked on it the already visited color turns to purple ? How can I make sure it stays white any idea ? Thank you both again so much you are both truly life savers ...

Member Avatar

to stop the browser from colouring visited links, over-ride it with css rules:

a:link{
  color: white;
}

a:visited{
  color: green;
}

a:hover{
  color: yellow;
}

a:active{
  color: red;
}

ALways place the link rules in that order or they may not work properly in every browser. REM: LoVe HAte

Make thread solved..

Member Avatar

there's a link below this edit box