Tema: Una barra que se pegue en el bottom de toda la página
Ver Mensaje Individual
  #7 (permalink)  
Antiguo 07/01/2012, 21:54
doom13
 
Fecha de Ingreso: diciembre-2011
Ubicación: Buenos Aires, GBA Zona Norte
Mensajes: 10
Antigüedad: 12 años, 4 meses
Puntos: 0
Respuesta: Una barra que se pegue en el bottom de toda la página
Cita:
Iniciado por emprear Ver Mensaje
a ver esto
Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <title>titulo</title> 
  6. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  7.  
  8. <style type="text/css">
  9. /*<![CDATA[*/
  10. #top-title {
  11. background-color: red;
  12. }
  13.  
  14. #menu{
  15. float: left;
  16. background-color: cyan;
  17. }
  18.  
  19. #mid {
  20. float: left;
  21. background-color: yellow;
  22. }
  23.  
  24.    #bottom{
  25. clear: both;
  26.     width: 600px;
  27.     height: 25px;
  28.     background: #222;
  29.     box-shadow: 0px 0px 4px rgba(255,255,255,1);
  30.     border-top-left-radius: 100px;
  31.     border-top-right-radius: 100px;
  32.     border-bottom-left-radius: 0px;
  33.     border-bottom-right-radius: 0px;
  34.    }
  35.  
  36. /*]]>*/
  37. </style>
  38. </head>
  39.  <body>
  40.  <!-- Esto está arriba de todo-->
  41.  <div id="top-title"><center>D4mnat1on</center></div>
  42.  
  43.  <!-- Esto debería estar a la izquierda del contenido-->
  44.  <div id="menu">
  45.    Menu <br /> <br />
  46.    <a href="index.htm">Intro</a><br />
  47.    <a href="otro.link">otra web</a><br />
  48.    <a href="otro.link">otro lugar</a><br />
  49.   </div>
  50.  
  51.   <!-- Contenido -->
  52.   <div id="mid">
  53.    Texto a escribir <br />
  54.    <br />
  55.    <br />
  56.    <br />
  57.    espacio para demostrar que al scrollear la barra HACIA abajo el bottom se queda en un punto de la página, y no que se queda abajo de todo.
  58.    <br />
  59.    <br />
  60.    <br />
  61.    <br />
  62.    <br />
  63.    a
  64.   </div>
  65.   
  66.   <!-- Esto debe estar siempre debajo de toda la web, pero no pegado al browser sino que, al scrollear abajo de todo, se vea esto:... -->
  67.   <div id="bottom">
  68.    Diseñado a código por doom13. 2012. Todos los derechos reservados.
  69.   </div>
  70.  </body> 
  71. </html>

no es fácil entender exactamente

Saludos
Gracias, me quedé pensando y comparando, me dí cuenta que hice cualquiera jajajaj. Te agradezco por recordar el concepto básico de las capas.

¡Finalmente lo pude arreglar! Gracias por tu atención y paciencia y te pido disculpas. A veces soy muy duro en pensamiento ^^.