IMPORTANTE:Solo pasa en google chrome y en mozila firefox.
Hola todos, tengo el siguiente problema.
la dirección de la pagina del problema es la siguiente : ( http://chichichistes.comocreartuweb.es/plantilla.html)
Y miarchivo de estilos llamado "estilo-general.css" contiene las siguientes lineas de codigos.
1-* {text-indent:0px ; margin:0px ; padding:0px ; border:0px }
2-p {text-align:justify;}
3-h1 {font-size:1.2em; color:blue; font-weight:bold; text-decoration:underline; text-align:center;}
4-h2 {font-size:1.1em; color:blue; font-weight:bold; text-decoration:none; text-align:center;}
5-body {text-align:center;}
6-#global {width:800px; margin:4px auto;}
7-#curva-superior {background-image:url(objetos/curva-superior.gif);
8-background-repeat:no-repeat; width:800px; height:8px; overflow:hidden;}
9-#cabecera {background-color:white; border-left:black 1px solid;
10-border-right:black 1px solid; height:80px;}
11-#logotipo {width:280px; float:left;}
12-#publicidad {background-color:white; width:518px; float:right; margin-top:25px;}
13-#navegacion {background-color:gray; border: black 1px solid; height:20px;}
14-#navegacion li {float:left; list-style:none; margin:0px 20px 0px 20px;}
15-#navegacion ul{margin-left:180px}
16-#contenido {background-color:orange; border-left:black 1px solid; border-right:black 1px solid;}
17-#contenido p {padding:5px 10px 5px 10px; text-indent:15px;}
18-#menu {width:150px; float:left; text-align:left; margin:3px 10px 3px 3px; background-image: url(objetos/menu-parte-inferior.gif); background-
19-position:bottom; padding-bottom:5px;}
20-#menu li{list-style:none; margin:4px 20px 4px 6px;}
21-#menu h1{text-decoration:none; font-size:12px; background-image: url(objetos/menu-parte-superior.gif);}
22-#pie {background-color:white; border-left: black 1px solid ; border-right: black 1px solid;
23-border-top: black 1px solid; height: 65px ;}
24-#pie li {list-style:none; font-size: 12px;}
25-#pieuno {float:left; width:150px;}
26-#piedos {float:left; width:498px;}
27-#pietres {float:left; width:150px;}
28-#curva-inferior {background-image:url(objetos/curva-inferior.gif); background-repeat:no-repeat; width:800px; height:12px; overflow:hidden;)
29-a {color: brown ; text-decoration: none ; display:block;}
30-a:link {}
31-a:visited {}
32-a:hover {color: red ; text-decoration:underline ; background-color: silver;}
33-a:active {}
34-#pie a {color: blue; text-decoration:none ; display: block }
35-#pie a:link {}
36-#pie a:visited {}
37-#pie a:hover {color:black ; text-decoration:underline ; background-color: white }
38-#pie a:active {color:black}
39-#logotipo a {}
40-#logotipo a:link {}
41-#logotipo a:visited {}
42-#logotipo a:hover {background-color: white }
43-#logotipo a:active {}
CODIGO HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
<title>Page title</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera">
<div id="logotipo"><a href="index.html"><img src="objetos/logotipo.gif" width="270"
height="80"alt="Haz clic aquí para volver a la página de inicio"></a></div>
<div id="publicidad">Bienvenidos a mi Web</div>
</div>
<div id="navegacion">
<ul>
<li><a href="#">Sección 1</a></li><li><a href="#">Sección 2</a></li><li><a href="#">Sección 3</a></li><li><a href="#">Sección 4</a></li>
</ul>
</div>
<div id="contenido">
<div id="menu">
<h1>Título de Sección 1</h1>
<ul>
<li><a href="#">Elemento de lista, 1</a></li><li><a href="#">Elemento de lista, 2</a></li><li><a href="#">Elemento de lista, 3</a></li><li><a href="#">Elemento de lista, 4</a></li>
</ul>
</div>
<h1>Esta será la zona principal de la web</h1>
<p>En esta zona de mi web debop escribir muchos parrafos para que sobrepase el menu.</p>
<h2>Aparte de todo</h2><p>tengo que aprender a ponerles margenes y algo que se llama sangia que no se para que sirve.</p>
<p>Bueno,parece que ya lo estoy logrando, me pondre manos a la obra con los nuevos temas.</p>
<p>Al parecer me hizo falta mas texto, por eso escribo esto que realmente no dice nada
que nos pueda servir a ti o a mi pero me sirve para llenar espacio :)</p>
</div>
<div id="pie">
<div id="pieuno">
<ul>
<li><a href="#">Foro Ejemplo</a></li><li><a href="#">Contactos</a></li><li><a href="#">Nos Enlazan</a></li>
</ul>
</div>
<div id="piedos">pie dos</div>
<div id="pietres">
<ul>
<li><a href="#">Directorio</a></li><li><a href="#">TopSite</a></li><li><a href="#">Mapa de la Web</a></li>
</ul>
</div>
</div>
<div id="curva-inferior"></div>
</div>
</body>
</html>
Mis problemas son estos:
-En el menu lateral segun los codigos de "ejemplo con divs" de estados de los enlaces, de el archivo de estilos (lineas 29-33) , deberian ponerse grises los enlaces al ponerles el mouse ensima, cosa que ocurre en html-kit
pero no en internet, y ya he subido todos los achivos al hosting.
-Lo mismo sucede con los enlaces de el pie de pagina, que tienen tambien codigos de estados de los enlaces en el archivo de estilos(lineas 34-3
-Por ultimo, en el programa html-kit, donde si aparecen los colores de los enlaces, solo se "colorea " hasta la parte escrita de el enlace, problema que CCTW decia solucionar aumentando el valor de el margin derecho, tal como lo hice en la linea 20. pero no funciona, quisiera saver por que no me funciona y que puedo hacer para mejorarlo.
MUCHISISISISISISISISIMAS gracias a todo los que me ayuden.
Citar
