Ver Mensaje Individual
  #6 (permalink)  
Antiguo 01/02/2013, 04:42
Avatar de C2am
C2am
 
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 16 años
Puntos: 306
Respuesta: centrar html con anchos 100%

Una rápida respuesta sería mas o menos así:
Código HTML:
Ver original
  1. <div id="wrapper"> ancho 100%
  2.  
  3.   <div id="top">  
  4.    <ul>menu</ul>
  5.   </div>
  6.  
  7. <div id="logo">
  8.   <img src="logo"/> <!-- como es el logo no debe ir como fondo -->
  9. </div>
  10.  
  11. <div id="content">
  12.     slider
  13. </div>
  14. <div id="contenido">
  15. contenido
  16. </div>
  17.   <section>pie de pagina </section>
  18.  
  19. </div>
Código CSS:
Ver original
  1. #wrapper{
  2. background: gris; /* igual que contenido */
  3. width:100%;
  4. }
  5.  
  6. #top{
  7. background: grisoscuro /* igual que menu */
  8. margin:0 auto;
  9. width:100%;
  10. height:auto; /* o la necesaria para que contenga el menu */
  11. }
  12.  
  13. #menu{
  14. background: grisoscuro;
  15. margin: 0 auto; /* lo importante es el auto de los margenes laterales */
  16. width:1060px; /*aunque se recomienda 960px */
  17. }
  18.  
  19. #logo{
  20. background: blanco ;
  21. width:100%;
  22. text-align:center; /* en caso de meter la imagen directamente sin caja (div) */
  23. }
  24. #logo img{
  25. margin: 0 auto;
  26. width:1060px;
  27. }
  28.  
  29. #content{ /*que está en el css del slider */
  30. margin: 0 auto; /* lo importante es el auto de los margenes laterales */
  31. width:1060px;
  32. }
  33.  
  34. #contenido{
  35. background:grisclaro; /*igual que wrapper */
  36. margin: 0 auto; /* lo importante es el auto de los margenes laterales */
  37. width:1060px;
  38. }
  39.  
  40. footer{
  41. background: negro;
  42. width:100%;
  43. }
  44.  
  45. footer section {
  46. margin: 0 auto; /* lo importante es el auto de los margenes laterales */
  47. width:1060px;
  48.  
  49. }

Espero que entiendas lo que quise decir.
Saludos

Por las dudas un burdo ejemplo: http://jsfiddle.net/c2am/7PumF/1/embedded/result/
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--

Última edición por C2am; 01/02/2013 a las 04:56