Entrar

Varios errores en mi nueva pág. web

balarma · · Solicitar retirada
Saludos compañeros y compañeras.

He terminado mi nueva web (www.educandoasuperro.es), y al subirla toda al servidor, me encuentro los siguientes fallos:

1. Los enlaces de todas las imágenes se ven con fondo blanco ocupando toda la celda de la tabla al poner el ratón sobre ellas. [en todos los navegadores]

2. Si accedéis a la sección "LOS PROBLEMAS DE CONDUCTA", podréis ver que hay unas flechitas en la parte inferior derecha, que sirven para navegar entre las distintas páginas de las sección. Pues bien, en los navegadores Chrome y Safari se ven desplazadas más abajo (se ven debajo del menú lateral izquierdo).

3. Por último, si accedéis a "NUESTROS SERVICIOS" podéis ver que las 4 fotografías que enlazan a sus respectivas secciones, aparecen desplazadas hacia la izquierda. [en todos los navegadores menos en Internet Explorer]

Aquí os dejo el código de la hoja de estilos (.CSS), y el código de la página de inicio, por ejemplo.

HOJA DE ESTILOS (.CSS):

* {margin:0px ; padding:0px}
img {border: none}
p {font-size: 0.8em ; text-align: justify}
h1 {font-size: 1.6em; color:LightGray ; font-weight: bold ; text-decoration: none ; text-align: center ; padding: 20px 10px 5px 265px}
h2 {font-size: 1.1em; color:LightGray ; font-weight: bold ; text-decoration: none ; text-align: center ; padding: 5px 10px 15px 260px}
h3 {font-size: 0.8em; font-family: arial, Helvetica, sans-serif ; color:LightGray ; font-weight: bold ; text-decoration: none ; text-align: left ; margin: 17px 0px 5px 0px}
.centrar {text-align:center}
body {text-align: center ; font-family: arial, Helvetica, sans-serif ; color: LightGray ; background-color: black}
#global {width:920px ; margin: 0px auto }
#cabecera {background-color: DarkRed ; height:150px }
#logotipo {width:920px ; float:center ; list-style:none }
#navegacion {float:center ; background-color: DarkRed }
#contenido {background-color: black ; width: 920px ; float:left}
#contenido p {padding: 5px 0px 5px 250px}
#image {float:center ; margin: 15px}
#enlace {text-align: justify ; font-weight:bold ; font-size: 0.8em ; margin: 0px 15px 0px 250px}
#mapaweb1 li {text-align: justify ; font-weight:bold ; font-size: 0.7em ; margin: 5px 10px 1px 30px}
#mapaweb2 li {text-align: justify ; font-weight:bold ; font-size: 0.7em ; margin: 0px 10px 0px 45px}
#flash {float:center ; list-style:none}
#menu {width: 240px ; float:left ; text-align:left ; margin: 5px 10px 100px 0px}
#menu li {list-style:none ; font-size: 0.8em ; margin: 5px 0px 5px 0px}
#submenu {float:center ; margin: 15px}
#submenu li {float:center ; list-style:none}
#submenu p {text-align:center ; font-size: 0.9em ; padding: 3px 0px 0px 16px}
#flechas {float:right ; margin: 10px 0px 0px 5px}
#flechas li {float:center ; list-style:none}
a {color: LightGray ; text-decoration: none ; display: block}
a:link {}
a:visited {}
a:hover {color: white ; text-decoration:none ; background-color: DarkRed}
a:active {}
a.enlace {color: LightGray; text-decoration:underline ; display: inline }
a.enlace:link {}
a.enlace:visited {}
a.enlace:hover {color: DarkRed ; text-decoration:none ; background-color: black }
a.enlace:active {}
#menu a {color: DarkRed; text-decoration:none ; display: block }
#menu a:link {}
#menu a:visited {}
#menu a:hover {color: LightGray ; text-decoration:none ; background-color: white }
#menu a:active {}
#submenu a {color: LightGray; text-decoration:none ; display: block }
#submenu a:link {}
#submenu a:visited {}
#submenu a:hover {color: LightGray ; text-decoration:none ; background-color: white }
#submenu a:active {}
#flechas a {color: LightGray; text-decoration:none ; display: block }
#flechas a:link {}
#flechas a:visited {}
#flechas a:hover {color: LightGray ; text-decoration:none ; background-color: white }
#flechas a:active {}
#mapaweb1 a {color: LightGray; text-decoration:none ; display: block }
#mapaweb1 a:link {}
#mapaweb1 a:visited {}
#mapaweb1 a:hover {color: DarkRed ; text-decoration:none ; background-color: white }
#mapaweb1 a:active {}
#mapaweb2 a {color: LightGray; text-decoration:none ; display: block }
#mapaweb2 a:link {}
#mapaweb2 a:visited {}
#mapaweb2 a:hover {color: DarkRed ; text-decoration:none ; background-color: white }
#mapaweb2 a:active {}

CÓDIGO DE INDEX.HTML:

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

<html>
<head>
<title>Educando a su perro. Centro integral de comportamiento canino y terapias con animales</title>
<link rel="stylesheet" href="estils-generals.css" type="text/css" media="all">
<script src="scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<meta name="author" content="Educando a su perro telf. 675 843 915 [correo eliminado]">
<meta name="keywords" content="educando a su perro, centro integral de comportamiento canino y terapias con animales, educacion canina, terapias asistidas con animales, terapias asistidas con perros, solución problemas de convivencia con perros, tratamiento de problemas de comportamiento canino, agresividad canina, ansiedad por separación, hiperapego, destrozos por perros, ladridos continuados, mi perro ladra a todas horas, mi perro no obedece, curso completo de adiestramiento, curso completo de obediencia básica, curso de adiestramiento canino ontinyent, curso de adiestramiento canino vall d'albaida, curso de adiestramiento canino valencia y alicante">
<meta name="description" content="Educando a su perro. Centro integral de comportamiento canino y terapias con animales">
<meta name="robots" content="all, follow">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="shortcut icon" href="http://www.educandoasuperro.es/favicon.ico" type="image/x-icon">

<script type="text/javascript">

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-21452954-1']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

</script>

</head>
<body>

<div id="global">
<div id="cabecera">
<div id="logotipo">
<img src="objectes/logo.jpg" width="920" height="150">
</div>
</div>
<div id="navegacion">
<table width="100%" border="0" align="center">
<colgroup>
<col width="10%">
<col width="40%">
<col width="30%">
<col width="10%">
<col width="10%">
</colgroup>
<tr valign="center" align="center" height="25">
<td width="10%"><a href="index.html">INICIO</a></td>
<td width="40%"><a href="suscribirse.html">Suscribirse a nuestro bolet&iacute;n electr&oacute;nico gratuito</a></td>
<td width="30%"></td>
<td width="10%"><a href="mapa-web.html">Mapa web</a></td>
<td width="10%"><a href="contacto.html">Contacto</a></td>
</tr>
</table>
</div>
<div id="contenido">
<div id="menu">
<ul><h3>LA NATURALEZA DEL PERRO</h3><li><a href="naturaleza.html"><img src="objectes/naturaleza.png" width="133" height="100" alt="LA NATURALEZA DEL PERRO" title="LA NATURALEZA DEL PERRO"></a></li></ul>
<ul><h3>LOS PROBLEMAS DE CONDUCTA</h3><li><a href="problemas-de-conducta.html"><img src="objectes/problemas-de-conducta.jpg" width="133" height="100" alt="LOS PROBLEMAS DE COMPORTAMIENTO" title="LOS PROBLEMAS DE COMPORTAMIENTO"></a></li></ul>
<ul><h3>NUESTROS SERVICIOS</h3><li><a href="nuestros-servicios.html"><img src="objectes/nuestros-servicios.jpg" width="133" height="100" alt="NUESTROS SERVICIOS" title="NUESTROS SERVICIOS"></a></li></ul>
</div>
<h1>Educando a su perro</h1>
<h2>Centro integral de comportamiento canino y terapias con animales</h2>
<p>Probablemente usted estar&aacute; buscando una <b>soluci&oacute;n a los problemas de convivencia con su perro</b>. ¿Sab&iacute;a que <b>educando a su perro</b> le har&aacute; m&aacute;s feliz y mejorar&aacute; su calidad de vida?</p>
<p>A trav&eacute;s de <a class="enlace" href="nuestros-servicios.html"><b>nuestros servicios en su propio domicilio</b></a> podemos ayudarle a <b>mejorar la relaci&oacute;n con su mascota</b>. Nos centramos en el <b>tratamiento de problemas de comportamiento canino</b> como la <b>agresividad</b>, la <b>ansiedad por separaci&oacute;n</b>, que provoca <b>destrozos en casa</b>, las <b>fobias</b>, los <b>miedos e inseguridades</b>, los <b>ladridos continuados</b> y la <b>desobediencia en general</b> mediante un <b>curso completo de adiestramiento</b>.</p>
<p>Mediante <b>terapias con animales</b> tambi&eacute;n nos ocupamos de controlar cualquier reacci&oacute;n de <b>miedo de las personas hacia los animales</b>, as&iacute; como de <b>mejorar los s&iacute;ntomas de depresi&oacute;n</b>, <b>baja autoestima</b> o <b>falta de actividad f&iacute;sica y mental en ancianos</b>.</p>
<p>Si tiene usted alguno de los problemas que le hemos descrito, le invitamos a navegar por nuestra web. Puede comenzar por la secci&oacute;n <a class="enlace" href="naturaleza.html"><b>la naturaleza del perro</b></a> para entender mejor su situaci&oacute;n personal.</p>
<p>¡Cu&eacute;ntenos su caso! <a class="enlace" href="contacto.html">Le escuchamos.</a></p>
</div>
</body>
</html>


Gracias mil!!!!!!!!
Yaneth · · Solicitar retirada
no se a que te refieres con esto.. yo no veo el fondo blanco (a ya lo vi con ie ) para solucionarlo debes quitar el display:bloc del css o bien crear un grupo de "a" para las imágenes
1. Los enlaces de todas las imágenes se ven con fondo blanco ocupando toda la celda de la tabla al poner el ratón sobre ellas. [en todos los navegadores]

2. Si accedéis a la sección "LOS PROBLEMAS DE CONDUCTA", podréis ver que hay unas flechitas en la parte inferior derecha, que sirven para navegar entre las distintas páginas de las sección. Pues bien, en los navegadores Chrome y Safari se ven desplazadas más abajo (se ven debajo del menú lateral izquierdo).
lo mismo, es por el dislpay bloc, y aparte debes crear un grupo de "a" para este enlace, poniendole en a: text-align:right para que te lo ponga fijo a la derecha como lo deseas

3. Por último, si accedéis a "NUESTROS SERVICIOS" podéis ver que las 4 fotografías que enlazan a sus respectivas secciones, aparecen desplazadas hacia la izquierda. [en todos los navegadores menos en Internet Explorer]

aqui ponle float-left al div sumbenu

saludos
balarma · · Solicitar retirada
Gracias Yaneth por toda tu ayuda, pero ya lo solucioné (se me olvidó entrar y comentarlo). Lo solucioné, simplemente, cambiando el color de los enlaces tanto en el menú lateral como en el central en la sección "nuestros servicios". Tan fácil como eso.

Las flechas inferiores tienen ahora otra construcción: las he creado con una capa, en vez de con una tabla. Ahora siempre aparecen donde quiero y en todos los navegadores (esto ya lo hice en mi primera web, y me funciona perfectamente).

Y el centrado del menú central (fotografías dentro de una tabla 2x2), lo he solucionado dándole el máximo ancho que me admiten todos los navegadores (fui probando), y así no se nota la diferencia entre navegadores.

Gracias nuevamente. Voy a publicar la misma respuesta en el otro mensaje que publiqué en otra sección.


David V.