Ya he revisado ese manual y montones de tutoriales, y lo he mejorado algo más pero sigue sin ir bien del todo ¿qué es lo que tengo mal de mi código? En Safari no cambia nada de nada mientras que en Firefox sí.
inicio.html
<html>
<head>
<link rel="stylesheet" type="text/css" href="estilos.css"/>
</head>
<body>
<h1> PRUEBA</h1>
<img id="imagen1" src="imagenes/personajes.jpg" width="320" height="270"/>
</body>
</html>
estilos.css
@charset "UTF-8";
/* CSS Document */
h1 {color: red;
font-family:"Arial Black",Gadget, sans-serif;
font-size: 40px;
text-align: center;}
img#imagen1 {
position: relative;
left: 40%;
top: 11%;
margin: 0px;
padding:0px;
}