CoLoMz
21 Apr 2010, 12:24 AM
Here is the link (http://www.colomzdesigns.com/lafonda/index.html)
All my pages are aligned center like is supposed to be, but the "galería" link as you may see it is thrown to the left.
I have tried so many things I do not really know what to do now.
Help would be appreciated!
Tried to post CSS also but it said it was too long :(
HTML
<!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=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-us" />
<title>La Fonda Restaurante & Bar - Galería de imágenes</title>
<meta name="author" content="Julian Galeano - CoLoMz Designs" />
<meta name="copyright" content="Copyright 2010 - La Fonda Restaurante & Bar" />
<meta name="title" content="La Fonda Restaurante & Bar - Galería de imágenes" />
<meta name="Description" content="La Fonda Restaurante & Bar, Cocina típica colombiana en Hartford, Connecticut, USA." />
<meta name="Keywords" content="La Fonda, restaurante, bar, colombiano, Colombia, típico, cocina típica, Hartford, Connecticut" />
<link rel="stylesheet" href="../CSS/fonda.css" type="text/css" />
<link rel="stylesheet" href="../CSS/sidemenu.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#t_wrapper').css("display", "none");
$('#t_wrapper').fadeIn(500);
});
</script>
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body onload="MM_preloadImages('../images/rollovers/menu.gif','../images/rollovers/eventos.gif','../images/rollovers/promociones.gif')">
<table id="t_wrapper" align="center" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="4" id="left"></td>
<td colspan="3" id="logo"><a href="../index.html"><img src="../images/logo_fonda.png" width="172" height="95" alt="La Fonda Restaurante & Bar" /></a></td>
<td colspan="6" id="top" align="right"><a class="top" href="buzon.html">Buzón</a> | <a class="top" href="mapa.html">Mapa</a></td>
<td rowspan="5" id="right"></td>
</tr>
<tr>
<td id="l_nav"></td>
<td colspan="3"><a href="comidas.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menu','','../images/rollovers/menu.gif',1)"><img src="../images/menu.gif" alt="Menu" name="menu" width="108" height="17" border="0" id="menu" /></a></td>
<td><a href="eventos.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('eventos','','../images/rollovers/eventos.gif',1)"><img src="../images/eventos.gif" alt="Eventos" name="eventos" width="108" height="17" border="0" id="eventos" /></a></td>
<td><a href="promociones.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('promociones','','../images/rollovers/promociones.gif',1)"><img src="../images/promociones.gif" alt="Promociones" name="promociones" width="162" height="17" border="0" id="promociones" /></a></td>
<td><img src="../images/rollovers/galeria.gif" width="108" height="17" alt="Galería de imágenes" /></td>
<td colspan="2" id="r_nav"></td>
</tr>
<tr>
<td id="bannerleft_g" colspan="2" rowspan="2"><img src="../images/bgaleria.gif" width="144" height="508" border="0" alt="Fonda Galería" /></td>
<td id="menuinfo" colspan="6" rowspan="2">
<table id="t_menuwrapper" align="center" cellpadding="0" cellspacing="0">
<tr>
<td id="menuwrapper" align="center">
<table id="t_menutitle" align="center" cellpadding="0" cellspacing="0">
<tr>
<td id="menutitle_g" align="center">
<p>
<span id="text_title_g">GALERÍA DE IMÁGENES</span>
<br />
<span id="text_fonda_g">Galería 1</span>
</p>
</td>
</tr>
<tr>
<td>
<div id="gallery">
<div id="imagearea">
<div id="image"> <a href="javascript:slideShow.nav(-1)" class="imgnav " id="previmg"></a> <a href="javascript:slideShow.nav(1)" class="imgnav " id="nextimg"></a> </div>
</div>
<div id="thumbwrapper">
<div id="thumbarea">
<ul id="thumbs">
<li value="1"><img src="thumbs/1.jpg" /></li>
<li value="2"><img src="thumbs/2.jpg" /></li>
<li value="3"><img src="thumbs/3.jpg" /></li>
<li value="4"><img src="thumbs/4.jpg" /></li>
<li value="5"><img src="thumbs/5.jpg" /></li>
</ul>
</div>
</div>
</div>
<div id="text_gallery">Pon el cursor sobre el borde derecho o izquierdo para ver las imágenes. Dale clíck a la imágen que desees ver.</div>
<script type="text/javascript">
var imgid = 'image';
var imgdir = 'fullsize';
var imgext = '.jpg';
var thumbid = 'thumbs';
var auto = false;
var autodelay = 0;
</script>
<script type="text/javascript" src="slide.js"></script>
</td>
</tr>
</table>
</td>
</tr>
</table></td>
<td valign="top" width="142" height="337" align="center" bgcolor="#FFFFFF"><table id="t_sidemenu_g" align="center" cellpadding="0" cellspacing="0">
<tr>
<td id="t_topsidemenu"></td>
</tr>
<tr>
<td id="t_descargamenu_p" align="center"><p> <span id="text_dl">OBSERVA</span> <br />
<span id="text_dlfonda">NUESTRAS FOTOS</span></p>
<p> <a href="#"><img src="../images/reciente.png" alt="Lo más reciente" width="80" height="40" hspace="0" vspace="0" border="0" /></a></p></td>
</tr>
<tr valign="top">
<td id="t_sidemenu_btns" align="center"><div class="navbar">
<div class="whole">
<div class="topitem_g" align="center">Galería de imágenes</div>
<div class="submenu">
<div class="subitem"><a class="menuitem" href="#">Galería 1</a></div>
<div class="subitem"><a class="menuitem" href="#">Galería 2</a></div>
<div class="subitem"><a class="menuitem" href="#">Galería 3</a></div>
<div class="subitem"><a class="menuitem" href="#">Galería 4</a></div>
<div class="subitem"><a class="menuitem" href="#">Galería 5</a></div>
<div class="subitem"><a class="menuitem" href="#">Galería 6</a></div>
</div>
</div>
</div></td>
</tr>
</table></td>
</tr>
<tr>
<td id="t_imageside"><img src="../images/guy.gif" width="142" height="171" border="0" alt="guy" /></td>
</tr>
<tr>
<td width="73" nowrap="nowrap"></td>
<td width="143" nowrap="nowrap"></td>
<td width="1" nowrap="nowrap"></td>
<td width="28" nowrap="nowrap"></td>
<td width="79" nowrap="nowrap"></td>
<td width="108" nowrap="nowrap"></td>
<td width="162" nowrap="nowrap"></td>
<td width="108" nowrap="nowrap"></td>
<td width="1" nowrap="nowrap"></td>
<td width="142" nowrap="nowrap"></td>
<td width="75" nowrap="nowrap"></td>
</tr>
</table>
<table id="t_copyright" align="center" cellpadding="0" cellspacing="0">
<tr>
<td id="copyrighttext" align="center">
Copyright © 2010 La Fonda Restaurante & Bar, all rights reserved.
<br />
By <a href="http://www.colomzdesigns.com/" target="_blank" class="colomz">CoLoMz Designs</a> | <a href="http://validator.w3.org/check?uri=referer" target="_blank" class="validation">XHTML 1.0</a> & <a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank" class="validation">CSS 2.1</a>
</td>
</tr>
</table>
</body>
</html>
All my pages are aligned center like is supposed to be, but the "galería" link as you may see it is thrown to the left.
I have tried so many things I do not really know what to do now.
Help would be appreciated!
Tried to post CSS also but it said it was too long :(
HTML
<!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=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-us" />
<title>La Fonda Restaurante & Bar - Galería de imágenes</title>
<meta name="author" content="Julian Galeano - CoLoMz Designs" />
<meta name="copyright" content="Copyright 2010 - La Fonda Restaurante & Bar" />
<meta name="title" content="La Fonda Restaurante & Bar - Galería de imágenes" />
<meta name="Description" content="La Fonda Restaurante & Bar, Cocina típica colombiana en Hartford, Connecticut, USA." />
<meta name="Keywords" content="La Fonda, restaurante, bar, colombiano, Colombia, típico, cocina típica, Hartford, Connecticut" />
<link rel="stylesheet" href="../CSS/fonda.css" type="text/css" />
<link rel="stylesheet" href="../CSS/sidemenu.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#t_wrapper').css("display", "none");
$('#t_wrapper').fadeIn(500);
});
</script>
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body onload="MM_preloadImages('../images/rollovers/menu.gif','../images/rollovers/eventos.gif','../images/rollovers/promociones.gif')">
<table id="t_wrapper" align="center" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="4" id="left"></td>
<td colspan="3" id="logo"><a href="../index.html"><img src="../images/logo_fonda.png" width="172" height="95" alt="La Fonda Restaurante & Bar" /></a></td>
<td colspan="6" id="top" align="right"><a class="top" href="buzon.html">Buzón</a> | <a class="top" href="mapa.html">Mapa</a></td>
<td rowspan="5" id="right"></td>
</tr>
<tr>
<td id="l_nav"></td>
<td colspan="3"><a href="comidas.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menu','','../images/rollovers/menu.gif',1)"><img src="../images/menu.gif" alt="Menu" name="menu" width="108" height="17" border="0" id="menu" /></a></td>
<td><a href="eventos.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('eventos','','../images/rollovers/eventos.gif',1)"><img src="../images/eventos.gif" alt="Eventos" name="eventos" width="108" height="17" border="0" id="eventos" /></a></td>
<td><a href="promociones.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('promociones','','../images/rollovers/promociones.gif',1)"><img src="../images/promociones.gif" alt="Promociones" name="promociones" width="162" height="17" border="0" id="promociones" /></a></td>
<td><img src="../images/rollovers/galeria.gif" width="108" height="17" alt="Galería de imágenes" /></td>
<td colspan="2" id="r_nav"></td>
</tr>
<tr>
<td id="bannerleft_g" colspan="2" rowspan="2"><img src="../images/bgaleria.gif" width="144" height="508" border="0" alt="Fonda Galería" /></td>
<td id="menuinfo" colspan="6" rowspan="2">
<table id="t_menuwrapper" align="center" cellpadding="0" cellspacing="0">
<tr>
<td id="menuwrapper" align="center">
<table id="t_menutitle" align="center" cellpadding="0" cellspacing="0">
<tr>
<td id="menutitle_g" align="center">
<p>
<span id="text_title_g">GALERÍA DE IMÁGENES</span>
<br />
<span id="text_fonda_g">Galería 1</span>
</p>
</td>
</tr>
<tr>
<td>
<div id="gallery">
<div id="imagearea">
<div id="image"> <a href="javascript:slideShow.nav(-1)" class="imgnav " id="previmg"></a> <a href="javascript:slideShow.nav(1)" class="imgnav " id="nextimg"></a> </div>
</div>
<div id="thumbwrapper">
<div id="thumbarea">
<ul id="thumbs">
<li value="1"><img src="thumbs/1.jpg" /></li>
<li value="2"><img src="thumbs/2.jpg" /></li>
<li value="3"><img src="thumbs/3.jpg" /></li>
<li value="4"><img src="thumbs/4.jpg" /></li>
<li value="5"><img src="thumbs/5.jpg" /></li>
</ul>
</div>
</div>
</div>
<div id="text_gallery">Pon el cursor sobre el borde derecho o izquierdo para ver las imágenes. Dale clíck a la imágen que desees ver.</div>
<script type="text/javascript">
var imgid = 'image';
var imgdir = 'fullsize';
var imgext = '.jpg';
var thumbid = 'thumbs';
var auto = false;
var autodelay = 0;
</script>
<script type="text/javascript" src="slide.js"></script>
</td>
</tr>
</table>
</td>
</tr>
</table></td>
<td valign="top" width="142" height="337" align="center" bgcolor="#FFFFFF"><table id="t_sidemenu_g" align="center" cellpadding="0" cellspacing="0">
<tr>
<td id="t_topsidemenu"></td>
</tr>
<tr>
<td id="t_descargamenu_p" align="center"><p> <span id="text_dl">OBSERVA</span> <br />
<span id="text_dlfonda">NUESTRAS FOTOS</span></p>
<p> <a href="#"><img src="../images/reciente.png" alt="Lo más reciente" width="80" height="40" hspace="0" vspace="0" border="0" /></a></p></td>
</tr>
<tr valign="top">
<td id="t_sidemenu_btns" align="center"><div class="navbar">
<div class="whole">
<div class="topitem_g" align="center">Galería de imágenes</div>
<div class="submenu">
<div class="subitem"><a class="menuitem" href="#">Galería 1</a></div>
<div class="subitem"><a class="menuitem" href="#">Galería 2</a></div>
<div class="subitem"><a class="menuitem" href="#">Galería 3</a></div>
<div class="subitem"><a class="menuitem" href="#">Galería 4</a></div>
<div class="subitem"><a class="menuitem" href="#">Galería 5</a></div>
<div class="subitem"><a class="menuitem" href="#">Galería 6</a></div>
</div>
</div>
</div></td>
</tr>
</table></td>
</tr>
<tr>
<td id="t_imageside"><img src="../images/guy.gif" width="142" height="171" border="0" alt="guy" /></td>
</tr>
<tr>
<td width="73" nowrap="nowrap"></td>
<td width="143" nowrap="nowrap"></td>
<td width="1" nowrap="nowrap"></td>
<td width="28" nowrap="nowrap"></td>
<td width="79" nowrap="nowrap"></td>
<td width="108" nowrap="nowrap"></td>
<td width="162" nowrap="nowrap"></td>
<td width="108" nowrap="nowrap"></td>
<td width="1" nowrap="nowrap"></td>
<td width="142" nowrap="nowrap"></td>
<td width="75" nowrap="nowrap"></td>
</tr>
</table>
<table id="t_copyright" align="center" cellpadding="0" cellspacing="0">
<tr>
<td id="copyrighttext" align="center">
Copyright © 2010 La Fonda Restaurante & Bar, all rights reserved.
<br />
By <a href="http://www.colomzdesigns.com/" target="_blank" class="colomz">CoLoMz Designs</a> | <a href="http://validator.w3.org/check?uri=referer" target="_blank" class="validation">XHTML 1.0</a> & <a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank" class="validation">CSS 2.1</a>
</td>
</tr>
</table>
</body>
</html>