Ver Mensaje Individual
  #1 (permalink)  
Antiguo 04/09/2013, 18:47
artforhum
 
Fecha de Ingreso: enero-2011
Mensajes: 21
Antigüedad: 13 años, 10 meses
Puntos: 0
centrar contenido al medio no me funciona

hola,

estoy intentando alinear el conteniado de mi página al centro con la propiedad margin:0 auto; en el containe o wrapper y no me lo ajusta del todo al centro..

a parte tengo un slideshow descargado de internet y este slide no me lo ajusta, supongo que es porque está en position:absolute, pero me gustaria saber como poder ajustarlo y sino tmbien intente sacarlo de position absolute, pero entonces el problema es que al pasar las imagenes, se coloca una abajo de la otra, como podria arreglar esto??

aqui os dejo el codigo

muchas gracias

Código HTML:
Ver original
  1.     <div id="container">
  2.         <header>
  3.             <h1> LOGO </h1>
  4.             <nav>
  5.                 <ul>
  6.                     <li>
  7.                         <a class="nav2" href="#"> Inicio </a>
  8.                     </li>
  9.                     <li>
  10.                         <a class="nav1" href="#"> Quienes somos </a>
  11.                     </li>
  12.                     <li>
  13.                         <a class="nav2" href="#"> Cursos </a>
  14.                     </li>
  15.                     <li>
  16.                         <a class="nav3" href="#"> Proyectos </a>
  17.                     </li>
  18.                     <li>
  19.                         <a class="nav2" href="#"> Galería </a>
  20.                     </li>
  21.                     <li>
  22.                         <a class="nav3" href="#"> Contacto </a>
  23.                     </li>
  24.             </nav>
  25.         </header>
  26.         <section>
  27.             <div id="slideshow">
  28.                 <div class="img" id="img-0" style="z-index:0;">
  29.                     <img src="img/img-slide1.jpg" width="900" height="350" />
  30.                 </div>
  31.          
  32.                 <div class="img" id="img-1" style="z-index:10;">
  33.                     <img src="img/img02.jpg" width="900" height="350" />
  34.                 </div>
  35.          
  36.                 <div class="img" id="img-2" style="z-index:20;">
  37.                     <img src="img/img03.jpg" width="900" height="350" />
  38.                 </div>

Código CSS:
Ver original
  1. body{
  2.         width:100%;
  3.     }
  4.     #container{
  5.         width:1200px;
  6.         margin:0 auto;
  7.     }
  8.                         /* HEADER */
  9.     header{
  10.         margin:50px 10px 10px 40px;
  11.         overflow:hidden;
  12.     }
  13.  
  14.     .......
  15.  
  16. #slideshow {
  17.     width:900px;
  18.     height:350px;
  19.     position:absolute;
  20.     top:100px;
  21.     left:30px;
  22. }
  23.  
  24. #slideshow .img {
  25.     width:100%;
  26.     height:100%;
  27.     position:absolute;
  28.     visibility:hidden;
  29.     top:100px;
  30.     left:30px;
  31.     float:left;
  32. }

http://www.subirimagenes.net/i/130905024555870418.jpg

Última edición por pzin; 05/09/2013 a las 14:40 Razón: formatear código