Porqué me sale una franja gris a lo ancho de mi página

Hola, esto es algo que me trae de cabeza, llevo algún tiempo con ello y sin embargo creo que debe ser una tontería.
Cuando pongo un enlace en mi página , me sale la franja gris del enlace a todo lo ancho.
Me falta algún código o no lo hago bien.
Me podéis ayudar?

"Magnífica vista del Pantano de San Juan y Costa de Madrid"

"Carta asociación"

El enlace se encuentra en "Carta asociación"

http://a-vecinos-costamadrid.net78.net/

Un saludo y gracias

Hola,
esto es algo que me trae de cabeza, llevo algún tiempo con ello y sin embargo creo que debe ser una tontería.
Cuando pongo un enlace en mi página , me sale la franja gris del enlace a todo lo ancho.
Me falta algún código o no lo hago bien.
Me podéis ayudar?

El problema lo tengo en el buzón de correo

http://a-vecinos-costamadrid.net78.net/contactar/contactar1.html

Gracias

Si te sirve de consuelo, si quitas: display: block en a { de tu hoja de estilos, solo aparece en lo que es la imagen de tu buzon y no en toda la linea; ahora mirare exactamente porque te sale eso.

Un saludo.

Claro...como no me habia dado cuenta antes:

a:hover {color: blue ; text-decoration: underline ; background-color: silver}

En esa linea, al final, tienes puesto que al pasar el raton por TODOS los enlaces de tu web, te aparezca un color gris plata; por lo que si quieres modificarlo, debes hacerlo ahi; pero recuerda que TODO se vera afectado.

Un saludo.

Puedes definir varios tipos de enlaces, unos con unas propiedades (como ese fondo plata) y otros tipos con otras distintas.

Por ejemplo, si especificas en tu hoja de estilos esa linea anterior:

a:hover {color: blue ; text-decoration: underline ; background-color: silver}

Todos los enlaces quedan con esas propiedades, tal y como dice Victor. Si ahora quieres un tipo distinto de enlace puedes crear esta otra línea bajo la anterior (al estar despues, sobreescribe las propiedades que se repitan en ambas lineas)

a.tipo2:hover {  background-color: red}

Ahora todos los enlaces tendrán las propiedades definidas en la primera línea, salvo que al enlace le digas que es del tipo tipo2, de esta manera:

<a class="tipo2" href="..ruta../archivo.html">Texto del Enlace</a>

Escribo de cabeza, pero creo que está bien lo dicho.

Un abrazo!

Oye, muchíiiiiiiiiiiiiiisimas gracias a los dos, resuelto, he puesto el enlace para el buzón del color del fondo de la página y resuelto. No conocía esa forma de poner el código a.tipo2:hover . Llevaba ya unas cuantas preguntas con este tema. À bientôt.

Abrazos

Puedes hacer otra cosa y es NO definir un estilo general sino los tipos que vas a usar. Me explico. Eliminas la línea

a:hover {color: blue ; text-decoration: underline ; background-color: silver;}

o la dejas pero indicas solo lo que van a tener en común toooodos los enlaces de tu web.

a:hover {text-decoration: underline ;}

Luego creas tipos con las propiedades concretas de cada tipo distinto, por ejemplo:

a.buzon:hover {color: blue ; background-color: silver;}
a.menu:hover {color: red ; background-color: yellow;}
a.contenido:hover {color: white ;}

En esas tres últimas no defines text-decoration: underline ; pues ya la tienen en común al aparecer en la línea genérica.

Por supuesto, estamos hablando solamente del estado hover, que indica el estado del enlace cuando el puntero del ratón está sobre dicho enlace. Pero te recomiendo que definas los cuatro estados para cada tipo, es decir, link, visited, hover y active. Forma parte de las buenas prácticas definir siempre los 4 estados y además en ese orden que te indico.

Gracias jorgens, esto me va a llevar un poquito más de tiempo para analizarlo. Creo que el curso lo tendríamos que repetir un par de veces porque la primera lo hacemos un poco en automático y con una segunda lo entenderiamos mejor pero como somos unos impacientes, nos queremos lanzar al ruedo enseguida sin tener estoque ni capote y así pasa.
Gracias, ya te cuento.

Gracias a Dios tampoco tenemos un toro delante, je je je.

Ya nos contarás.

Hola jorgens,

He analizado detenidamente lo que me has explicado y ya lo tengo perfectamente claro .... o casi. La otra noche ya no veia ni la pantalla y menos entender.

Revisando mi hoja de estilo y para no tener que repasar los seis capítulos del curso, me puedes decir porqué se pone en algunos casos " #pie a:hover " y en otros " a.buzon:hover ", quiero decir:
1.- En el primer caso ponemos # y pie antes de la a:hover
2.- En el segundo ponemos primero a. luego buzon entre medias y después :hover
Sabiendo que pie es el pie de página y que buzon es el buzón de correo por supuesto.
Me imagino que en el primer caso estamos creando una zona y en segundo es solo un class=buzon.

Muchísimas gracias por la aclaración del otro día. Por cierto no puedo dar formato o colores a los códigos para diferenciarlos porque el foro no me da la opción o al menos yo no la veo. Esto ocurre cuando tengo que poner un título. Cuando la respuesta es sin título si me salen las opciones de formato.
Un abrazo