Ligero Problemilla con cabecera web hecha con Photoshop

[_EpY_]

Hola muy buenas.

Soy nuevo tanto con el Photoshop como en el foro, estoy haciendo mis pinitos con el Photoshop para maquetar una pagina web, y al crear una cabecera con sus sectores para que uno de ellos sea un hipervínculo se me ha planteado un problema... el hipervinculo sale distorsionado el sector dónde está el hipervinculo, hasta que paso el ratón por encima y se pone bien, os lo enseño por fotos.

Cuando abro la página:


Cuando paso el ratón por encima:


Un saludo :D

[C2am]

Hola y Bienvenid@ _EpY_ al foro.

Dado que es un problema de código y no imágenes lo mejor es que publiques el código que estas usando (html y css).

Por lo que veo, creo que tienes una mala división, seguramente creada por el fotoyop.
Digo, yo crearía una imagen con la mascota, otra imagen con el logo, pero transparente, y dejaría el color de fondo y los bordes para el css.
Luego acomodaría todo con el html y el css.

Saludos

PD: no veo las imágenes en el foro pero al seguir el link se ven perfectamente.

[_EpY_]

Hola buenas de nuevo, lo primero perdon por la tardanza, no he tenido internet hasta hoy :D

Vuelvo a poner aqui los enlaces que no me deja editarlo.

Cuando abro la página:
[URL=http://imageshack.us/photo/my-images/16/45839033.gif/][IMG]http://imageshack.us/a/img16/17/45839033.th.gif[/IMG][/URL]

Cuando paso el ratón por encima:
[URL=http://imageshack.us/photo/my-images/850/24907624.gif/][IMG]http://imageshack.us/a/img850/5427/24907624.th.gif[/IMG][/URL]

Gracias por contestar C2am, aqui te pongo los codigos.

HTML del index

Código:

<div id="banner">
	<?php include("banner.php"); ?>
</div>

CSS

Código:

#banner{
	width: 100%;
	height: 300px;
}

HTML de banner.php

Código:

<!-- ImageReady Slices (Banner motoclub.psd) -->
<table id="Tabla_01" width="100%" height="300" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td colspan="3">
			<img src="images/banner/bannerguardarrailes_01.gif" width="100%" height="69" alt=""></td>
	</tr>
	<tr>
		<td rowspan="2">
			<img src="images/banner/bannerguardarrailes_02.gif" width="100%" height="231" alt=""></td>
		<td>
			<a href="http://motoclublavirgen.foroactivo.com/f9-entra-y-lucha-con-nosotros" target="_blank"
				onmouseover="window.status='Enlace a la seccion Entra y lucha con nosotros del foro';  return true;"
				onmouseout="window.status='';  return true;">
				<img src="images/banner/Guardarrailes.gif" width="100%" height="117" border="0" alt="Entra y lucha con nosotros"></a></td>
		<td rowspan="2">
			<img src="images/banner/bannerguardarrailes_04.gif" width="100%" height="231" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="images/banner/bannerguardarrailes_05.gif" width="100%" height="114" alt=""></td>
	</tr>
</table>
<!-- End ImageReady Slices -->

El problema creo que puede ser que estoy intentando que la página se vea adptada a todas las resoluciones y me esta dando varios quebraderos de cabeza...

Un saludo.

[_EpY_]

Por Cierto en el PC se me ve bien, en el movil mal, que me acabo de dar cuenta, debe ser algo de compatibilidades con el navegador del smartphone...