Tema: capa de pie que no se superponga
Ver Mensaje Individual
  #3 (permalink)  
Antiguo 22/06/2011, 01:56
Avatar de insyse
insyse
 
Fecha de Ingreso: abril-2005
Ubicación: Colombia
Mensajes: 206
Antigüedad: 19 años
Puntos: 5
Respuesta: capa de pie que no se superponga
Este es el CSS completo


Código CSS: 
Ver original
  1. @charset "utf-8";
  2.  
  3. @font-face {
  4.     font-family: 'Eras';
  5.     src: url('eraslght-webfont.eot');
  6.     src: url('eraslght-webfont.eot?#iefix') format('embedded-opentype'),
  7.          url('eraslght-webfont.woff') format('woff'),
  8.          url('eraslght-webfont.ttf') format('truetype'),
  9.          url('eraslght-webfont.svg#ErasLightITCRegular') format('svg');
  10.     font-weight: normal;
  11.     font-style: normal;
  12. }
  13. @font-face {
  14.     font-family:'Bodoni';
  15.     src: url('bodoni-webfont.eot');
  16.     src: url('bodoni-webfont.eot?#iefix') format('embedded-opentype'),
  17.          url('bodoni-webfont.woff') format('woff'),
  18.          url('bodoni-webfont.ttf') format('truetype'),
  19.          url('bodoni-webfont.svg#BodoniRoman') format('svg');
  20.     font-weight: normal;
  21.     font-style: normal;
  22. }
  23.  
  24. #redes{
  25. width:350px; 
  26. height:60px; 
  27. float:right; 
  28. position:absolute; 
  29. top: 445px;
  30. left: 750px;
  31. }
  32.  
  33. html, body {
  34. text-shadow: 0px 1px 1px #333333;
  35. font-family: 'Eras'; 
  36. font-size:16px; 
  37. font-weight:bold; 
  38. margin: 0; 
  39. padding: 0; 
  40. height: 100%; 
  41. color:#000; }
  42.  
  43. /* COMMON CLASSES */
  44. .break { clear:both; }
  45.  
  46. /* HEADER */
  47. #header {z-index:0;}
  48. .headerimg { 
  49. background-position: center top; 
  50. background-repeat: no-repeat; 
  51. width:100%; height:100%; 
  52. position:absolute; 
  53. background-color:#000000; }
  54.  
  55. /* CONTENT */
  56. #content { 
  57. width: 100%; 
  58. position: relative; 
  59. min-height: 100%; 
  60. height: auto !importante; 
  61. height: 100%; z-index:1;}
  62.  
  63. #content p { 
  64. padding:10px 20px; 
  65. font-size:16px; 
  66. width:960px; 
  67. margin:0 auto; }
  68.  
  69. #content p a { 
  70. text-decoration:none; 
  71. color:#CD2B3A; }
  72.  
  73. #content p a:hover { 
  74. text-decoration:underline; 
  75. color:#7F000C; }
  76.  
  77. h1{ 
  78. font-family:'Bodoni'; 
  79. font-size:24px; color:#000; }
  80.  
  81. #pie {
  82. width: 100%; 
  83. position: absolute; 
  84. bottom: 0 !importante; 
  85. bottom: -1px; 
  86. height: 100px; 
  87. background-image:url(img/fondo_pie.png); 
  88. background-position: center top; 
  89. background-repeat:no-repeat; 
  90. vertical-align:middle; color:#FFFFFF; }
  91.  
  92. #cabecera {
  93. width: 100%; 
  94. position: relative; 
  95. top: 0 !importante; 
  96. height: 55px; 
  97. background-image:url(img/fondo_top.png); 
  98. background-position: center bottom; 
  99. background-repeat:no-repeat; 
  100. vertical-align:middle; 
  101. color:#FFFFFF; 
  102. font-weight:bold; }
  103.  
  104. .cabecera a { 
  105. text-decoration:none; 
  106. color:#fff; 
  107. font-weight:bold; }
  108.  
  109.  
  110. #contenido { 
  111. background-image:url(img/fondoNegro50.png); 
  112. padding:15px; 
  113. height:500px; 
  114. width:920px; 
  115. margin:100px auto 0 auto; 
  116. -moz-border-radius:5px; 
  117. -webkit-border-radius:5px; 
  118. color:#000;  
  119. position:relative; 
  120. }