Foros del Web » Creando para Internet » CSS »

No encajo el footer ni los bordes

Estas en el tema de No encajo el footer ni los bordes en el foro de CSS en Foros del Web. Buenas! Estoy con una web y me estoy haciendo un lío con el css... Así es como la tengo y se me ve en firefox: ...
  #1 (permalink)  
Antiguo 15/06/2011, 06:31
Avatar de JJMD  
Fecha de Ingreso: junio-2011
Ubicación: Cartagena
Mensajes: 3
Antigüedad: 5 años, 7 meses
Puntos: 0
No encajo el footer ni los bordes

Buenas!

Estoy con una web y me estoy haciendo un lío con el css...
Así es como la tengo y se me ve en firefox:


edit: así se me ve en chrome: http://imageshack.us/photo/my-images/839/unled222222222.png/ (como lo quiero pero sería con los dos footers abajo)

Lo que me gustaría es que las rayas naranjas siguieran hasta abajo del todo y la verde de abajo del todo se quede en medio, pero abajo del todo.
Además, que la imagen de CC y el texto de debajo, se quede justo encima del pie verde.
Y bueno, que todo el color más claro se extienda por todo lo oscuro (creo que se me entiende, espero haberme explicado bien)

Aquí dejo código :S

Código HTML:
Ver original
  1. <table cellspacing="0" cellpadding="0" align="center" style="border:0 none; width:100%">
  2.     <tbody>
  3.         <tr>
  4.             <td class="border_left">
  5.             </td>
  6.                 <td class="content">
  7.                     <div class="topbar">
  8.                       <table cellspacing="0" cellpadding="0" border="0" style="width:100%;">
  9.                             <tr>
  10.                                  <td id="header_logo" width="1"> <a href="http://10.81.143.241" title="Ffdfd" Class="topimg">
  11.                                  <img src="http://flasdfaf.img" style="border: 0 none;vertical-align:middle; margin: 0px;" alt="FldfS"></a>
  12.                                 </td>
  13.                             </tr>
  14.                         </table>
  15.                     </div>
  16.                    
  17.                     <div style="width: 100%; padding-top: 4px;" id="bg_header_bar">
  18.                         <table border="0" cellspacing="0" cellpadding="0" style="width: 100%;">
  19.                             <tbody>
  20.                                 <tr style="vertical-align:middle">
  21.                                     <td class="smalltext" style="vertical-align:middle;text-align:right;padding-right:10px; padding-top:0px; padding-bottom:0px;font-weight:bold">
  22.                                         <?php echo date("d-m-Y, H:i:s");?>
  23.                                     </td>
  24.                                 </tr>
  25.                             </tbody>
  26.                         </table>
  27.                     </div>
  28.                    
  29.                    
  30.                     <div id="bg_nav_links">
  31.                     | <a href="http://10.81.143.241" class="nav_important">Inicio</a>&nbsp;|
  32.                     <a href="http://10.81.143.241">asdf</a>&nbsp;|
  33.                     <a href="http://10.81.143.241">fdsa</a>&nbsp;|
  34.                     <a href="http://10.81.143.241">asdfasdf</a>&nbsp;|
  35.                     <a href="http://10.81.143.241">Cqwerqwe</a>&nbsp;|
  36.                     <a href="http://10.81.143.241">5768uyhn</a>&nbsp;|
  37.                    
  38.                     </div>
  39.                
  40.                
  41.  
  42.                 <div class="content">
  43.                     <table width="100%" cellpadding="0" cellspacing="0" border="0">
  44.                         <tbody>
  45.                             <tr>
  46.                             </tr>
  47.                         </tbody>
  48.                    
  49.  
  50. AQUÍ ESTÁ LA TABLA QUE SE VE EN LA IMAGEN CON EL BOTÓN
  51.  
  52. </div>
  53.                 <div id="footer">
  54.                     <span class="smalltext"><br>
  55.                         <center><a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/2.5/es/"><img alt="Creative Commons License" style="border-width:0" src="http://creativecommons.org/images/public/somerights20.png"></a><br></center><p></p><p></p><center><b>xxxxxxxx ® 2080 - 2011. <i>Esta Web está bajo una <a href="http://GOOGLE.ES">Licencia ASDF DE FDSA ASDF Y TAL Y CUAL</a></i></b></center><b>
  56.                     <br>
  57.                 </b></span><b>
  58.                 </b>
  59.               </div>
  60.                        <div id="hooter"></div>    
  61.                
  62.                     </td>
  63.                    
  64.                 </td>
  65.                 <td class="border_right"></td>
  66.         </tr>
  67.     </tbody>

Y Aquí el código CSS:

Código CSS:
Ver original
  1. html, body {
  2. background: #919393;
  3. height:100%;
  4. margin: 0;
  5. padding: 0;
  6. }
  7.  
  8. #container {
  9.    min-height:100%;
  10.    position:relative;
  11. }
  12.  
  13.  
  14. .content {
  15. background: #CCC;
  16. margin: 5px;
  17. text-align: left;
  18. height:100%;
  19.  min-height:100%;
  20.  position:relative;
  21. width: auto;
  22.  
  23. }
  24.  
  25. #bg_nav_links {
  26. background: url(images/bg_nav.gif) #EBEBEB;
  27. border: solid 1px #6F6F6F;
  28. border-width: 1px 0;
  29. color: #999;
  30. font-size: 11px;
  31. height: 18px;
  32. margin-bottom: auto;
  33. margin-top: auto;
  34. padding-top: 4px;
  35. text-align: center;
  36. width: 100%;
  37. }
  38.  
  39. #bg_header_bar {
  40. background: url(images/bg_nav.gif) #EBEBEB;
  41. border: solid 1px #6F6F6F;
  42. border-width: 1px 0;
  43. color: #999;
  44. font-size: 11px;
  45. height: 18px;
  46. margin-bottom: auto;
  47. margin-top: auto;
  48. text-align: left;
  49. width: 100%;
  50. }
  51.  
  52. .topbar {
  53. background: url(images/blue/bg_header.gif) green;
  54.  
  55. }
  56.  
  57.  
  58. .border_left {
  59. background: url(images/bg_left.gif) orange;
  60. vertical-align: top;
  61. width: 20px;
  62. height:100%;
  63. min-height::100%;
  64.  
  65. }
  66.  
  67. .border_right {
  68. background: url(images/bg_right.gif) orange;
  69. vertical-align: top;
  70. width: 20px;
  71. height:100%;
  72. min-height::100%;
  73.  
  74. }
  75.  
  76.  
  77.  
  78. table {
  79. empty-cells: show;
  80. }
  81.  
  82. table {
  83. display: table;
  84. border-collapse: separate;
  85. border-spacing: 2px;
  86. border-color: gray;
  87. }
  88.  
  89. td, th {
  90. display: table-cell;
  91. vertical-align: inherit;
  92. }
  93.  
  94.  
  95. #hooter {
  96.    position:absolute;
  97.    bottom:0;
  98.    width:100%;
  99.    height:20px;   /* Height of the footer */
  100.    background:green;
  101. }
  102.  
  103.  
  104.  
  105. div {
  106. display: block;
  107. }


En qué fallo? qué debo cambiar??





Gracias adelantadas!

Última edición por JJMD; 15/06/2011 a las 06:40

Etiquetas: bordes, footer
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:52.