Lo estoy haciendo devuelta paso a paso para ver donde esta el problema. El desplazamiento de la imagen con respecto al div parece ser producido por ponerlo en listas. Aca les paso el codigo mas simplificado a ver si se les ocurre algo.
Código HTML:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<link href="imgRotator/css/Prueba.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="Elemento">
<div id="s3slider">
<ul id="s3sliderContent">
<li class="s3Image"><img src="imgRotator/images/sliderImages/handle.jpg" /><span>Lorem ipsum dolor si lorum impsum donpretium volutpat cursus. Nunc sed diam erat, hendrerit commodo enim.</span></li>
</ul>
</div>
</div>
</body>
</html>
Código HTML:
#Elemento {
height: 300px;
width: 950px;
margin-right: auto;
margin-left: auto;
border: medium solid #333;
}
#Elemento #s3slider #s3sliderContent .s3Image {
list-style-type: none;
margin-top: 0px;
margin-left: 0px;
}