DIV problema para alinear

demoche · #1 (**permalink**) 11/11/2008, 10:27

Hola tengo una duda, ubique dentro de una tabla una DIV y no logro que se alinee Top y Left en 0px, es decir que no deje margen entre los vertices superior izquierda de mi tabla.
No logro dandole los "margin", como podria hacerlo para IE y FF?
Si alguien me puede ayudar, agradecido.
Saludos

demoche

kseso? · #2 (**permalink**) 11/11/2008, 11:01

¿Y si pones el código tanto de la tabla, la celda y el div? Ayudaría.
Porque si no es cuestión de bordes del dvi, puede ser padding de éste, bordes de la celda, padding de la celda...
Así, que como la bola anda escasa de batería, código, por favor ;)

ancortez · #3 (**permalink**) 29/11/2008, 22:57

Hola compañeros. Pues como vi que el compa tiene un problema como el mio y el ni hizo caso, no me queda mas remedio que exponer el mio a ver si alguien me puede ayudar.

El problema es igual, al mostrar en firefox se muestra un margen y en explorer se ve como quiero que se vea. Tengo el codigo html y mando llamar un archivo que contiene la imagen que se va a mostrar. el archivo que se incluye tiene un css y a su vez manda llamar codigo javascritp el cual no creo que sea el problema.

Bueno, aqui voy a poner el código html de la parte donde mando llamar el archivo que muestra la imagen:

Código HTML:

<tr>
<td width="823" height="161" align="left"><? include("includes/slideshow.php");?></td>
</tr>

Este es el código que se manda llamar:

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>s3Slider jQuery plugin</title>
<!-- CSS -->
<style type="text/css" media="screen">
#slider {
    width: 823px; /* important to be same as image width */
    height: 161px; /* important to be same as image height */
    position: relative;  /*important */
	overflow: hidden;  /*important */
}
#sliderContent {
    width: 823px; /* important to be same as image width or wider */
    height: 161px;
	position: relative;
	top: 0;
	margin-left: 0;
}
.sliderImage {
    height: 161px;
    position: absolute;
	display: none;
}
.sliderImage span {
	position:absolute;
	font: 10px/15px Arial, Helvetica, sans-serif;
    /*padding: 20px 40px;*/
    padding: 0px 0px 0px 0px;
	width: 823px;
/*    height: 30px;	*/
    background-color: #000;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
	-khtml-opacity: 0.7;
    opacity: 0.7;
    color: #fff;
    display: none;
}
.clear {
	clear: both;
}
.sliderImage span strong {
    font-size: 14px;
}
.top {
	top: 0;
	left: 0;
	text-align:right;
	right: 0;
}
.bottom {
	bottom: 0;
    left: 0;
}
ul { list-style-type: none;}
</style>
<!-- JavaScripts-->
<script type="text/javascript" src="includes/js/jquery.js"></script>
<script type="text/javascript" src="includes/js/s3Slider.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('#slider').s3Slider({
            timeOut: 5000
        });
    });
</script>
</head>

<body>
    <div id="slider" align="left">
        <ul id="sliderContent">
      <li class="sliderImage">
          <img src="imagenes/banner1.jpg"/>
          <span class="top"><strong>Cerro de la cruz.</strong><br />Imagen tomada desde la toma de agua</span>
      </li>
      <li class="sliderImage">
          <img src="imagenes/banner2.jpg" />
          <span class="top"><strong>Ruiz Nayarit</strong><br />Imagen panorámica de Ruiz Nayarit</span>
      </li>
      <li class="sliderImage">
          <img src="imagenes/banner3.jpg" />
          <span class="top"><strong>Puente del ferrocarril</strong><br />Sobre rio San Pedro</span>
      </li>	
      <li class="sliderImage">
          <img src="imagenes/banner4.jpg" />
          <span class="top"><strong>Plaza principal</strong><br />Situada en el centro de Ruiz Nayarit</span>
      </li>
      <li class="sliderImage">
          <img src="imagenes/banner5.jpg" />
          <span class="top"><strong>Rio San Pedro</strong><br />Imagen panorámica del cauce del rio</span>
      </li>
      <li class="sliderImage">
          <img src="imagenes/banner6.jpg" />
          <span class="top"><strong>Paso del ferrocarril</strong><br />sobre el puente del rio San Pedro</span>
      </li>
      <li class="sliderImage">
          <img src="imagenes/banner7.jpg" />
          <span class="top"><strong>Arco de la entrada de Ruiz Nayarit</strong><br />Dando la bienvenida a todos los visitantes</span>
      </li>                  
            <div class="clear sliderImage"></div>
        </ul>
    </div>
</body>
</html>

Como ven ahi dentro va el código CSS y es el que pienso que me da el problema.

Bueno, me despido esperando una pronta respuesta.

Gracias...