Ver Mensaje Individual
  #3 (permalink)  
Antiguo 30/06/2012, 05:09
maurikius1983
Usuario no validado
 
Fecha de Ingreso: abril-2012
Mensajes: 134
Antigüedad: 12 años, 7 meses
Puntos: 0
Respuesta: separacion img

Que va tio, no funciona, de todas formas le tengo un reset( comprobado que todo esta a 0), no se si en alfuna funcion de JS, aparece algo, pero nada ya lo he mirados.
Solo pasa cuando pongo varias etiquetas img juntas. Ni idea tio. No me molesa porque las metos en un div cada una y listo. Pero no veia la necesidad y a parte quiero saber que es lo que ocurre. dejo el codigo. a ver i ves algo.

Es en el FOOTER.

<html>
<head>
<title></title>
<meta charset="ISO-8859-1, UTF-8">
<link rel="stylesheet" type="text/css" href="css/reset.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link rel="shortcut icon" href="img/favicon.ico">
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<script src="js/jquery-1.7.min.js" ></script>
<script src="js/mi_script_galeria.js" ></script> <!-- Script Propio de Transcición de Imagenes con Efecto -->
<script src="js/mi_script_menu.js" ></script> <!-- Script Propio para Menu Tipo Acordeon -->
<script src="js/mi_script_musica.js" ></script> <!-- Script Propio para Activar/Desactivar Musica -->

</head>
<body>
<div id="container">

<div id="header">
<div id="logo"></div>
</div>
<div id="LeftSidebar">
<ul id="navlist">
<li><a href="index.html" class="active">Portada</a></li>
<li><a href="#">Espectáculos</a>
<ul>
<li><a href="infantiles.html">Infantiles</a></li>
<li><a href="adultos.html">Adultos</a></li>
</ul>
</li>
<li><a href="company.html">La Compañía</a>
<ul>
<li><a href="filosofia.html">Filosofía</a></li>
<li><a href="trayectoria.html">Trayectoria</a></li>
</ul>
</li>
<li><a href="director.html">El Director</a></li>
<li><a href="eventos.html">Eventos</a></li>
<li><a href="contacto.html">Contacto</a></li>
</ul>
</div>

<div id="content">
<div id="contCent">
<div id="gallery">
<div id="logoOficial"></div>
<img src="img/slideshow/1.jpg" width="800" height="500" alt="" class="actual" />
<img src="img/slideshow/2.jpg" width="800" height="500" alt="" />
<img src="img/slideshow/3.jpg" width="800" height="500" alt="" />
<img src="img/slideshow/4.jpg" width="800" height="500" alt="" />
<img src="img/slideshow/5.jpg" width="800" height="500" alt="" />
<img src="img/slideshow/6.jpg" width="800" height="500" alt="" />
<img src="img/slideshow/7.jpg" width="800" height="500" alt="" />
<img src="img/slideshow/8.jpg" width="800" height="500" alt="" />
<img src="img/slideshow/9.jpg" width="800" height="500" alt="" />
</div>
</div>
<div id="contDer">
<div id="siguenos">
<div id="facebook"><a href="http://www.facebook.com/profile.php?id=100000897455909"></a></div>
<div id="blogger"><a href="http://labarataria.blogspot.com.es/" alt="Blogspot"></a></div>
<div id="youtube"><a href="http://www.youtube.com/CIABARATARIA"></a></div>
<!-- Le he puesto una imagen transparente para que no se vean los bordes blancos que aparecen en background image vuando esta de input -->
<input type="image" id="onOff" value="play" style="border:0" src="img/invisible.png"/>
<audio id="audio" loop="loop">
<source src="path/file.ogg" type="audio/ogg" >
<source src="music/sleepAway.mp3" type="audio/mp3" >
</audio>
</div>
</div>
</div>
<div id="footer">
<img src="img/merendarte.jpg" width="140" height="35" alt="" />
<img src="img/merendarte.jpg" width="140" height="35" alt="" />
<img src="img/merendarte.jpg" width="140" height="35" alt="" />
<img src="img/merendarte.jpg" width="140" height="35" alt="" />
<img src="img/merendarte.jpg" width="140" height="35" alt="" />
<img src="img/merendarte.jpg" width="140" height="35" alt="" />
<img src="img/merendarte.jpg" width="140" height="35" alt="" />
</div>
</div>
</body>
</html>


css

Código:
* {
margin: 0px;
padding: 0px;
}

body {
	background-color: #222222;
	font-family: Verdana, Arial, sans-serif;
	font-size: 16px;
	color: #ffffff;
	background-image: url('../img/textura.png');
}
 
#container {
	position: relative;
	width: 1000px;
	height: 650px;
	margin: auto;
}

img {
     margin:0;
     padding:0;
     border:0;
     outline:0;
}

/***********************Header*********************/
#header{
	position: relative;
	float: left; 
	width: 1000px;
	height: 90px;
}

#logo{
	position: relative;
	float: left; 
	width: 295px;
	height: 90px;
	margin-left: 5px;
	background-image: url('../img/logo.png');
}

/*********************Fin Header********************/

/********************Left Sidebar*******************/
#LeftSidebar{
	position: relative;
	float: left; 
	width: 150px;
}

#navlist{
	position: relative;
	float: left; 
	width: 150px;
}

#navlist ul li, #navlist li:last-child{
	border:none
}	

#navlist a{
	display: block;
	height: 25px;
	width: 100px; 
	padding: 10px;
	margin: 5px;
	line-height: 25px;
	background: inherit;
	border-right: 4px solid #444444;
	color: #f4f4f4;
	font-size: 0.9em;
	text-decoration: none;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-bottomleft: 10px;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	
}
#navlist a:hover{
	color: #f4f4f4;
	background: #333333;
	border-right: 4px solid #D01A71;
}

#navlist li .active {
	cursor: default;
	color: #f4f4f4;
	background: #333333;
	border-right: 4px solid #D01A71;
	margin-top: 0;
}

#navlist ul a{
	background: #333333;
}

ul{
	display:block;
	list-style:none;
}

#navlist li ul {
	display:none;
}

/*******************Fin Left Sidebar******************/

/***********************Content***********************/
#content{
	position: relative;
	float: left; 
	width: 850px;
	height: 520px;
}

/*** Contenedor Central ***/

#contCent{
	position: relative;
	float: left; 
	width: 820px;
	height: 520px;
	background-color: #333333;
	border-radius: 5px;
	box-shadow: inset 0px 0px 2px 1PX #111111;
    -moz-box-shadow: inset 0px 0px 2px 1PX #111111;
    -webkit-box-shadow: inset 0px 0px 2px 1PX #111111;
	margin-left: 5px;
}

#logoOficial{
	position: relative;
	float: right; 
	width: 100px;
	height: 90px;
	margin-top: 10px;
	background-image: url('../img/logoOficial.png');
	opacity: 0.4;
	z-index: 100;
}

#gallery{
	position: relative;
	float: left; 
	width: 800px;
	height: 500px;
	margin-top: 10px;
	margin-left: 10px;
	background-image: url('../img/loading.gif') no-repeat;
	
}

#gallery img
{
   position:absolute;
   top:0;
   left:0;
   z-index:1;
}

#gallery img.actual
{
	z-index: 3;
}

#gallery img.ultima-actual
{
	z-index: 2;

}

/*** Contenedor Derecho ***/

#contDer{
	position: relative;
	float: left; 
	width: 25px;
	height: 520px;
}

#siguenos{
	position: relative;
	float: left; 
	width: 25px;
	height: 120px;
	margin-top: 10px;
}

#facebook a{
	position: relative;
	float: left; 
	width: 25px;
	height: 25px;
	background-image: url('../img/facebook.jpg');
}

#blogger a{
	position: relative;
	float: left; 
	width: 25px;
	height: 25px;
	background-image: url('../img/blogger.jpg');
	margin-top: 4px;
}

#youtube a{
	position: relative;
	float: left; 
	width: 25px;
	height: 25px;
	background-image: url('../img/youtube.jpg');
	margin-top: 4px;
}

#audio{
	position: relative;
	float: left; 
	width: 25px;
	height: 25px;
	margin-top: 4px;
}

#onOff{
	position: relative;
	float: left; 
	width: 25px;
	height: 25px;
	background-image: url('../img/on.jpg');
	margin-top: 4px;
	cursor: pointer;
	border: 0;
	outline: none;
	color:transparent;
}

#onOff.activo{
	background-image: url('../img/on.jpg');
	cursor: pointer;
	border: 0;
	outline: none;
}

#onOff.inactivo{
	background-image: url('../img/off.jpg');
	cursor: pointer;
	border: 0;
	outline: none;
}

/*********************fin Content*********************/

/*********************Inicio Footer*********************/

#footer{
	position: relative;
	float: left;
	width: 1000px;
	height: 35px;
	margin-top: 5px;
}


/*********************fin Footer*********************/