Problemas de vista en diferentes navegadores

Alvaro Manuel · 17 Sep 2011, 06:53 · Solicitar retirada

:mrgreen:hola, buenas noches...

mi mensaje es para pedir ayuda con los codigos de mi web, pues en explorer se ve bien, pero en otros navegadores como google chrome se descuadra toda, no se cual sera el problema y si puedan ayudarme....

esta es la url: http://trinitarios.atwebpages.com/

esta es la hoja de estilos del index:
BODY {FONT: 12px "trebuchet ms", tahoma, Geneva, Arial, Helvetica, sans-serif; COLOR: #000; font-size-adjust: 0.51; BACKGROUND-POSITION: left top; BACKGROUND-IMAGE: url(objetos/fondo.gif); PADDING: 5px 0px; BACKGROUND-REPEAT: repeat-x; BACKGROUND-COLOR:#c8e7ff; TEXT-ALIGN: center}
P {PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 4px; MARGIN: 0px; PADDING-TOP: 0px; LINE-HEIGHT:18px; text-align:justify;text-indent:15px; FONT-SIZE: 16px}
P.adelante {FONT-SIZE:10px; text-indent:0px; text-align:center}
P.izquierda {FONT-SIZE:10px; text-indent:0px; text-align:LEFT}
h1 {FONT-SIZE: 12px; color:blue ; PADDING-BOTTOM: 0px; MARGIN: 0px}
h2 {FONT-SIZE: 16px; color:blue ; PADDING-BOTTOM: 5px; MARGIN: 0px}
A {TEXT-DECORATION: none; COLOR: #000000}
A IMG {BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none}
.paso {CLEAR: both; OVERFLOW: hidden; HEIGHT: 1px}
BR {FONT-SIZE: 1px; PADDING-BOTTOM: 0px; MARGIN: 0px}
#contenido {MARGIN: 0px auto; WIDTH: 924px}
#contenido-curva-superior {BACKGROUND-IMAGE: url(objetos/fondoarribacabecera.gif); OVERFLOW: hidden; WIDTH: 924px; HEIGHT: 12px}

#cabecera {background-color:white;border-left:black 1px solid;
border-right:black 1px solid;height:72px;}
#logotipo { width:270px; float:left;}
#publicidad { width:490px; float:right; }

#banners {BORDER-RIGHT: #000 1px solid; BACKGROUND-IMAGE: url(objetos/fondo-banners.gif); BORDER-LEFT: #000 1px solid; WIDTH: auto; HEIGHT: 90px; TEXT-ALIGN:center}
#banner1 {WIDTH: 270px; FLOAT: left}
#banner2 {WIDTH: 490px; FLOAT: right;margin-top:25px; font-size:16px }

#lenguetas {BACKGROUND-IMAGE: url(objetos/index-lenguetas-fondo.gif); BORDER-RIGHT: black 1px solid; BACKGROUND-POSITION: left top; BORDER-LEFT: black 1px solid; WIDTH: auto; BACKGROUND-REPEAT: repeat-x; HEIGHT: 24px; BACKGROUND-COLOR:#8B0000}
#lenguetas P {MARGIN-TOP: 0PX; COLOR: blue; TEXT-ALIGN:center; TEXT-INDENT:0px; FONT-SIZE: 16px; FONT-WEIGHT: bold}

#cuerpo {BACKGROUND:#CD0000; BORDER-RIGHT: #000 1px solid; BORDER-LEFT: #000 1px solid; WIDTH: auto; PADDING-TOP: 0px; PADDING-LEFT: 1px}
.centrado {text-align:center;}

#cuerpo-izq {FLOAT: left; MARGIN-LEFT: 2px; MARGIN-RIGHT: 2px; MARGIN-TOP: 0px; WIDTH: 141px }
#cuerpo-cent {FLOAT: left; MARGIN-LEFT: 2px; MARGIN-RIGHT: 2px; MARGIN-TOP: 0px; WIDTH: 625px }
#cuerpo-der {FLOAT: left; MARGIN-LEFT: 2px; MARGIN-RIGHT: 0px; MARGIN-TOP: 0px; WIDTH: 141px }
.cabecera-lateral {BACKGROUND-IMAGE: url(objetos/cabecera-lateral.gif) ; HEIGHT: 20px; WIDTH: auto}
#cabecera-central {BACKGROUND-IMAGE: url(objetos/curva-libreta-comp.gif) ; HEIGHT: 20px; WIDTH: auto}
.icontenido {BORDER-RIGHT: #838383 1px solid; BACKGROUND: #fff; BORDER-LEFT: #838383 1px solid; WIDTH: auto}
.espacio-minimo {DISPLAY: none}
.columna-central A {TEXT-DECORATION: none ;FONT-WEIGHT: 600 ; color:#6666FF}
#cuerpo-izq A {DISPLAY: block; text-align:justify}
#cuerpo-izq A:link {}
#cuerpo-izq A:visited {}
#cuerpo-izq A:hover {BACKGROUND: #E4E4E4}
#cuerpo-izq A:active {BACKGROUND: #FEF9CF}
#cuerpo-der A {DISPLAY: block; text-align:justify}
#cuerpo-der A:link {}
#cuerpo-der A:visited {}
#cuerpo-der A:hover {BACKGROUND: #E4E4E4}
#cuerpo-der A:active {BACKGROUND: #FEF9CF}
.columna-lateral {MARGIN: 0px 5px; WIDTH: auto}
.columna-lateral A {BORDER-top: #838383 1px solid; HEIGHT: 129px}
.columna-central {MARGIN: 0px 5px; WIDTH: auto; HEIGHT: 645px}
.ipie-lateral {BACKGROUND-IMAGE: url(objetos/index-pie-lateral.gif); MARGIN-BOTTOM: 0px; OVERFLOW: hidden; HEIGHT: 9px}
#ipie-central {BACKGROUND-IMAGE: url(objetos/curva-txt-inf-comp.gif); MARGIN-BOTTOM: 0px; OVERFLOW: hidden; HEIGHT: 9px}
#opciones-inferior {BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; WIDTH: auto; PADDING-TOP: 1px; BORDER-BOTTOM: #000000 1px solid; BACKGROUND-COLOR: #fef1c3; TEXT-ALIGN: center}
#uno {FLOAT: left; WIDTH: 120px; MARGIN-RIGHT: 28px; BACKGROUND-REPEAT: repeat-y; TEXT-ALIGN: center}
#dos {FLOAT: left; WIDTH: 625px; MARGIN-BOTTOM: 2px; margin-top:1px; TEXT-ALIGN: center}
#tres {FLOAT: left; WIDTH: 120px; MARGIN-LEFT: 28px; BACKGROUND-REPEAT: repeat-y; TEXT-ALIGN: center}
#uno IMG, #tres IMG {margin-bottom:3px}
#opciones-inferior A {FONT-SIZE: 12px}
#opciones-inferior A:LINKk {}
#opciones-inferior A:VISITED {}
#opciones-inferior A:HOVER {}
#opciones-inferior A:ACTIVE {COLOR: blue}
#pie {BORDER-RIGHT: #000000 1px solid; BORDER-LEFT: #000000 1px solid; WIDTH: auto; BACKGROUND-COLOR: white; TEXT-ALIGN: center}
#contador {FLOAT: left; WIDTH: 80px; TEXT-ALIGN: right; FONT-SIZE: 9px; }
#copyright {FLOAT: left; WIDTH: 672px; TEXT-ALIGN: center; FONT-SIZE: 12px; COLOR:black}
#contenido-curva-inferior {BACKGROUND-IMAGE: url(objetos/fondoabajocabecera.gif); OVERFLOW: hidden; WIDTH: 924px; HEIGHT: 12px}
.ci{color:#FF0000} .cii{color:#00FF00} .t{color:#FF8040} .w{color:#454545}

y este es el codigo del index:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>

<HEAD>
<TITLE>TRINITARIOS COLOMBIA - PUERTO RICO</TITLE>
<META content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<META content="es" http-equiv="Content-Language">
<META content="Pagina oficial de los trinitarios en Colombia y Puerto Rico" name="description">
<META content="trinitarios, orden de la santisima trinidad, trinitarios colombia, padres trinitarios" name="keywords">
<META content="all" name="robots">
<LINK rel="shortcut icon" href="cr.ico">
<LINK rel="stylesheet" href="comun/estilo-index.css" type="text/css" media="all">
</HEAD>

<BODY>

<DIV id="contenido">
<DIV id="contenido-curva-superior"></DIV>
<div id="cabecera">
<div id="logotipo"><a href="index.html"><img src="comun/objetos/medallon 01.gif" width="180" height="180" alt="Haz clic aquí para volver a la página de inicio"></a></div>
<div id="publicidad"><img src="comun/objetos/logo.png" width="652" height="180"></div>
</div>

<DIV id="lenguetas">
<h1>TRINITARIOS VICARIATO COLOMBIA - PUERTO RICO</h1>
</DIV>

<DIV id="cuerpo">
<DIV id="cuerpo-izq">
<DIV class="cabecera-lateral"></DIV>
<DIV class="icontenido">
<DIV class="columna-lateral">

<A href="seccion-01/somos.html">
<H1>QUIÉNES SOMOS:</H1>
<br>
<h1 class="centrado"><img alt="¿QUIÉRES CONOCER?" src="comun/objetos/interrogacion.jpg" height="130" width="130" /></h1>

</A >

<A href="seccion-02/presencia.html">
<H1>PRESENCIA TRINITARIA:</H1>
<br>
<h1 class="centrado"><img alt="COLOMBIA - PUERTO RICO" src="comun/objetos/mundo.png" height="130" width="130" /></h1>
</A >

<A href="seccion-03/apostolado.html">
<H1>APOSTOLADO TRINITARIO:</H1>
<br>
<h1 class="centrado"><img alt="NUESTRAS OBRAS" src="comun/objetos/asamblea.gif" height="140" width="110" /></h1>
</A >

<A href="seccion-04/formacion.html">
<H1>FORMACIÓN:</H1>
<br>
<h1 class="centrado"><img alt="ETAPAS FORMATIVAS" src="comun/objetos/jovenes.jpg" height="130" width="130" /></h1>
</A >

<A href="seccion-05/noticias.html">
<H1>NOTICIAS DE INTERÉS:</H1>
<br>
<h1 class="centrado"><img alt="ACTUALIDAD TRINITARIA" src="comun/objetos/periodic.gif" height="130" width="130" /></h1>
</A >

<DIV class="paso"></DIV>

</DIV>
</DIV>

<DIV class="ipie-lateral"></DIV>
</DIV>

<DIV id="cuerpo-cent">
<DIV id="cabecera-central"></DIV>
<DIV class="icontenido">
<DIV class="columna-central">
<img src="comun/objetos/c.jpg" width="40" height="40"> <img src="comun/objetos/hola.gif" width="300" height="100"><img src="comun/objetos/c.jpg" width="40" height="40">
<H2> BIENVENIDO AL RINCÓN VIRTUAL DE LA</H2>
<H2> ORDEN DE LA SANTÍSIMA TRINIDAD</H2>
<H2>VICARIATO</H2>
<H2>COLOMBIA - PUERTO RICO</H2><BR>
<p>En esta sección podrás encontrar diferentes temas acerca de nuestra comunidad en el mundo, y de manera
especial sobre la actividad de los Trinitarios en Colombia y Puerto Rico.</p>
<p>Puedes seleccionar entre nuestra diferentes secciones para conocer más de cerca nuestra forma de vida.</p>

<h2>LO MÁS DESTACADO EN ESTOS MOMENTOS</h2>
<p><a href="" </p>
<p><img alt="VIRGEN DEL BUEN REMEDIO" src="comun/objetos/virgen.jpg" height="440" width="316" /></p>
</DIV>
</DIV>
<DIV id="ipie-central"></DIV>
</DIV>

<DIV id="cuerpo-der">
<DIV class="cabecera-lateral"></DIV>
<DIV class="icontenido">
<DIV class="columna-lateral">

<A href="seccion-06/vocacional.html">
<H1>PASTORAL VOCACIONAL:</H1>
<br>
<h1 class="centrado"><img alt="VEN Y VERÁS" src="comun/objetos/manos.jpg" height="110" width="130" /></h1>
</A >

<A href="seccion-07/gobierno.html">
<H1>GOBIERNO VICARIAL:</H1>
<br>
<h1 class="centrado"><img alt="NOTICIAS DEL GOBIERNO VICARIAL" src="comun/objetos/trabajo-en-equipo.jpg" height="140" width="130" /></h1>

</A >

<A href="seccion-08/familia.html">
<H1>FAMILIA TRINITARIA:</H1>
<br>
<h1 class="centrado"><img alt="FRAILES,RELIGIOSAS Y LAICOS" src="comun/objetos/fa.jpg" height="140" width="130" /></h1>
</A >

<A href="seccion-09/recursos.html">
<H1>RECURSOS:</H1>
<br>
<h1 class="centrado"><img alt="LINKS DE INTERÉS" src="comun/objetos/arbol.gif" height="140" width="110" /></h1>

</A >

<A href="seccion-10/galeria.html">
<H1>GALERÍA DE FOTOS:</H1>
<br>
<h1 class="centrado"><img alt="UNA IMAGEN VALE MÁS..." src="comun/objetos/fotografo.gif" height="130" width="130" /></h1>

</A >

<DIV class="paso"></DIV>
</DIV>
</DIV>
<DIV class="ipie-lateral"></DIV>
</DIV>

<DIV class="paso"></DIV>
</DIV>

<DIV id="opciones-inferior"><DIV class="paso"></DIV>
<DIV id="uno">
<a href="mailto:[correo eliminado]"><img alt="[correo eliminado]" src="objetos/buzon.gif" height="40" width="40" /></a>
<h1 class="centrado">COLOMBIA</h1>
<p class="izquierda">BOGOTÁ:(57-1)2528255</p>
<p class="izquierda">MEDELLÍN:(57-4)2398679</p>
<p class="izquierda">IBAGUÉ:(57-8)2696036</p>
</DIV>
<DIV id="dos">

<FORM method=GET action="http://www.google.com/search">
<input type=hidden name=ie value=UTF-8>
<input type=hidden name=oe value=UTF-8>
<TABLE bgcolor="#FFFFFF"><tr><td>
<A HREF="http://www.google.com/">
<IMG SRC="http://www.google.com/logos/Logo_40wht.gif"
border="0" ALT="Google"></A>
</td>
<td>
<INPUT TYPE=text name=q size=31 maxlength=255 value="">
<INPUT type=submit name=btnG VALUE="Buscar en sitio">
<font size=-1>
<input type=hidden name=domains value="http://trinitarios.com.co/"><br><input type=radio name=sitesearch value=""> Google <input type=radio name=sitesearch value="http://trinitarios.atwebpages.com/" checked>http://www.trinitarios.com.co<br>
</font>
</td></tr></TABLE>
</FORM>
<h1 class="centrado">CURIA VICARIAL</h1>
<p class="adelante">CR 78a # 72a - 71 TEL :(57-1) 2525009 BOGOTÁ DC - COLOMBIA</p>

</DIV>
<DIV id="tres">
<a href="mailto:[correo eliminado]"><img alt="[correo eliminado]" src="objetos/buzon.gif" height="40" width="40" /></a>
<h1 class="centrado">PUERTO RICO</h1>
<p class="izquierda">ISABELA:(1787)8720126</p>
<p class="izquierda">PONCE:(1787)8426073</p>
<p class="izquierda">BAYAMÓN(1787)7996120</p>
</DIV>
<DIV class="paso"></DIV>
</DIV>

<DIV id="pie">
<DIV id="contador">

</DIV>
<DIV id="copyright">Todos los derechos reservados © 2011 WWW.TRINITARIOS.COM.CO________________________By...JAVALED O.SS.T</DIV>
<DIV class="paso"></DIV>
</DIV>

<DIV id="contenido-curva-inferior"></DIV>
</DIV>

</BODY>
</HTML>

espero que me puedan ayudar un poco, no se cual sera el error...
gracias por todo...

manmanu · 17 Sep 2011, 16:48 · Solicitar retirada

Hola Manuel....
Bueno, intentaré ayudar.

Haz tres cambios y mira si mejora un poco tu sitio.
Luego hay otros retoques que deberás correjirlos dependiendo de como lo has colocado, pero lo que te preocupa....

Justo antes de (en código html);

<DIV id="lenguetas"> coloca esto;
<div style="clear:both"></div>

De esta manera;

<div style="clear:both"></div>
<DIV id="lenguetas">
<h1>TRINITARIOS VICARIATO COLOMBIA - PUERTO RICO</h1>
</DIV>

En el código CSS deja como te lo pongo;

#cabecera {background-color:#FFF;border-left:black 1px solid;
border-right:black 1px solid;height:180px;}

#publicidad { width:490px; float:left;}

Luego esto....

<h2>LO MÁS DESTACADO EN ESTOS MOMENTOS</h2>
<p><a href="" </p>

Te falta cerrar ></a>

Suerte.

manmanu

Alvaro Manuel · 17 Sep 2011, 19:30 · Solicitar retirada

manmanu gracias por tu ayuda...

los fallos de la cabecera se corrigieron, pero el descuadre de las columnas laterales y central, aun persiste en google, en explorer se ve perfecto el diseño que deseo se vea en los otros navegadores...

si saben de otro fallo ayuden por favor..

manmanu · 21 Sep 2011, 14:31 · Solicitar retirada

Hola Manuel...
Yo hice la prueba como te dije y funcionó bien.

Prueba a mover en un sitio y en otro <div style="clear:both"></div> para que te sostenga las capas, igual te resulta.

manmanu

Alvaro Manuel · 24 Sep 2011, 23:02 · Solicitar retirada

Hola ....
gracias amigo, ya he logrado reorganizar mi web, el descuadre estaba en el tamaño del cuerpo, que estaba muy chico el tamaño y por eso se salia el texto, pero ya lo arregle.....
gracias por la ayuda, ahora si no es mucha molestia quisiera saber si hay una seccion donde expliquen como poner una galeria de imagenes y como subir un video, por favor es que he buscado y no encuentro.......

Gracias y espero tu respuesta....