Qué le pasa a mi pagina web??

Hola chicos,

Soy Nadya y soy nueva en esto y quisiera saludar a todos los miembros de esta comunidad.

A ver si me podéis ayudar con mi problema. He empezado a hacer mi primera página web y la llevaba bastante bien hasta que he subido mi página a internet.
Resulta que todo lo que estaba viendo bien con mi HTML kit ahora no la puedo ver bien en los distintos navegadores. En IE me descoloca todos mis enlaces (con lo que me ha costado colocarlos con top y padding) y en mozilla se ve todo correctamente pero no puedo enlazar nada porque paso el puntero por encima y ni se inmutan.

Se me ha ocurrido pasaros el index.html y mi hoja de estilos. Además os paso mi URL.

Gracias de antemano. Feliz Navidad.

URL: http://notasyletras.comocreartuweb.es/index.html.
URL: http://notasyletras.comocreartuweb.es/idiomas.html.
URL: http://notasyletras.comocreartuweb.es/musica_iniciacion.html.


INDEX.HTML
----------------------------------------------------------------------------------------------------------------------------------------------------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<link rel="stylesheet" href="estilo.general.css" type="text/css" media="all">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>

<style>

#marco { border: 3px solid #000; position: relative; width: 800px; height: 1052px; z-index: 0;}
#etiqueta_quienes_somos { position: relative; width: 146px; height: 31px; padding: 45px; top: -785px; z-index: 1;}
#etiqueta_musica { position: relative; width: 146px; height: 31px; padding: 45px; top: -850px; z-index: 1;}
#etiqueta_idiomas { position: relative; width: 146px; height: 31px; padding: 45px; top: -915px; z-index: 1;}
#etiqueta_apoyo_escolar { position: relative; width: 146px; height: 31px padding: 45px; top: -980px; z-index: 1;}
#etiqueta_titulaciones { position: relative; width: 146px; height: 31px; padding: 45px; top: -1045px; z-index: 1;}
#etiqueta_calendario { position: relative; width: 146px; height: 31px; padding: 45px; top: -1110px; z-index: 1;}
#etiqueta_fotos { position: relative; width: 146px; height: 31px; padding; 45px; top: -1175px; z-index: 1;}
#etiqueta_condiciones { position: relative; width: 146px; height: 31px; padding: 45px; top: -1240px; z-index: 1;}
#forward { position: relative; width: 39px; height: 37px; padding: 130px; top: -1385px; z-index: 1;}
#rewing { position: relative; width: 39px; height: 37px; padding: 65px; top: -1617px; z-index: 1;}
#buzon { position: relative; width: 32px; height: 32px; padding: 455px; top: -1960px; z-index: 1;}
#logotipo { position: relative; width: 158px; height: 100px; padding: 605px; top: -3125px; z-index: 1;}
#facebook { position: relative; width: 40px; height: 40px; padding: 530px; top: -4470px; z-index: 1;}
#fw { position: relative; width: 29px; height: 23px; padding: 505px; top: -5750px; z-index: 1;}
#rew { position: relative; width: 29px; height: 23px; padding: 430px; top: -6708px; z-index: 1;}


</style>
</head>

<body>

<div id="global">

<div id="contenedor">
<div id="marco"><img src="objetos/global_presentacion.jpg" /></div>

<div id="etiqueta_quienes_somos"><img src="objetos/etiqueta_quienes_somos2.jpg" onmouseover="this.src='objetos/etiqueta_quienes_somos2.jpg';" onmouseout="this.src='objetos/etiqueta_quienes_somos2.jpg';"/></a></div>

<div id="etiqueta_musica"><a href="musica_iniciacion.html"><img src="objetos/etiqueta_musica.jpg" onmouseover="this.src='objetos/etiqueta_musica2.jpg';" onmouseout="this.src='objetos/etiqueta_musica.jpg';"/></a></div>

<div id="etiqueta_idiomas"><a href="idiomas.html"><img src="objetos/etiqueta_idiomas.jpg" onmouseover="this.src='objetos/etiqueta_idiomas2.jpg';" onmouseout="this.src='objetos/etiqueta_idiomas.jpg';"/></div>

<div id="etiqueta_apoyo_escolar"><a href="apoyo_escolar.html"><img src="objetos/etiqueta_apoyo_escolar.jpg" onmouseover="this.src='objetos/etiqueta_apoyo_escolar2.jpg';" onmouseout="this.src='objetos/etiqueta_apoyo_escolar.jpg';"/></a></div>

<div id="etiqueta_titulaciones"><a href="titulaciones.html"><img src="objetos/etiqueta_titulaciones.jpg" onmouseover="this.src='objetos/etiqueta_titulaciones2.jpg';" onmouseout="this.src='objetos/etiqueta_titulaciones.jpg';"/></a></div>

<div id="etiqueta_calendario"><a href="calendario.html"><img src="objetos/etiqueta_calendario.jpg" onmouseover="this.src='objetos/etiqueta_calendario2.jpg';" onmouseout="this.src='objetos/etiqueta_calendario.jpg';"/></a></div>

<div id="etiqueta_fotos"><a href="fotos.html"><img src="objetos/etiqueta_fotos.jpg" onmouseover="this.src='objetos/etiqueta_fotos2.jpg';" onmouseout="this.src='objetos/etiqueta_fotos.jpg';"/></a></div>

<div id="etiqueta_condiciones"><a href="condiciones.html"><img src="objetos/etiqueta_condiciones.jpg" onmouseover="this.src='objetos/etiqueta_condiciones2.jpg';" onmouseout="this.src='objetos/etiqueta_condiciones.jpg';"/></a></div>


<div id="forward"><a href="index2.html"><img src="objetos/forward.jpg" onmouseover="this
.src='objetos/forward2.jpg';" onmouseout="this.src='objetos/forward.jpg';"/></a></div>

<div id="rewing"><a href="index.html"><img src="objetos/rewing.jpg" onmouseover="this.src='objetos/rewing2.jpg';" onmouseout="this.src='objetos/rewing.jpg';"/></a></div>

<div id="buzon"><a href="mailto:[correo eliminado]"><img alt="Pulsa para escribirme un E-Mail!" src="objetos/buzon.gif" height="32px" width="32px" /></a></div>

<div id="logotipo"><a href="objetos/Propaganda grande.zip"><img src="objetos/logotipo.jpg"/></a></div>

<div id="mapita"><a href="http://maps.google.es/maps?q=calle+helen+keller+numero+8&oe=utf-8&r…" target="_blank"><img alt="Abrir mapa"src="objetos/mapita.jpg"/></a></div>

<div id="facebook"><a href="http://www.facebook.com/pages/Academia-de-M%C3%BAsica-e-Idiomas-Not…" target="_blank"><img src="objetos/facebook.png"/></a></div>

<div id="fw"><a href="index2.html"><img src="objetos/fw.jpg" /></a></div>

<div id="rew"><a href="index.html"><img src="objetos/rew.jpg" /></a></div>
</div>


</div>

</body>
</html>

--------------------------------------------------------------------------------------------------------------------------------------------------------------
ESTILOS.GENERAL.CSS

* {text-indent:0px ; margin:0px ; padding:0px ; border:0px ;}
body {text_align: center; background: #F0F; height:0px;}
img { border-style: none;}
#global {width:800px; margin:4px auto;}
a:link {}
a:visited {}
a:hover {}
a:active {}

---------------------------------------------------------------------------------------------------------------------------------------------------------------
Hola Nadya! Si en el IE se ve distinto debes de hacer un Comentario Condicional.
Se coloca en el head el siguiente código:

<!--[if IE (versión del IE)]>
<link rel="stylesheet" type="text/css" href="ie.css" />
<!-->

Este código apunta a una hoja de estilo diferente que se llama ie.css (podes ponerle el nombre que quieras, esta se llama ie.css, pero podes ponerle pepito.css). Y tenes que re escribir el código CSS que se ve mal, SOLO eso. NO tenes que hacer todo el código CSS de nuevo.

Bueno, suerte con tu web! Saludos