Tema: Como dar un margen negativo de una tabla html?
Ver Mensaje Individual
  #5 (permalink)  
Antiguo 06/06/2012, 13:14
Avatar de emprear
emprear
Colaborador
  
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 16 años, 10 meses
Puntos: 1567
Respuesta: Como dar un margen negativo de una tabla html?
Si es por tu explicación, ahora entiendo 1/4 apenas, ahora , después de ver el link que pasaste y lo que hay en http://d2hforum.com/

Se me ocurre que a lo mejor lo que querés hacer es 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. </head>
  8. <body>
  9. <table style="width:100%;background-image: url(http://d2hforum.com/d2hforum.png);">
  10. <tbody><tr>
  11. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  12. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  13. </td>
  14. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="r" width="333">
  15. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  16. </td>
  17. </tr>
  18. <tr>
  19. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  20. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  21. </td>
  22. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  23. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  24. </td>
  25. </tr>
  26. <tr>
  27. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  28. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  29. </td>
  30. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  31. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  32. </td>
  33. </tr>
  34. <tr>
  35. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  36. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  37. </td>
  38. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  39. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  40. </td>
  41. </tr>
  42. <tr>
  43. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  44. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  45. </td>
  46. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  47. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  48. </td>
  49. </tr>
  50. <tr>
  51. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  52. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  53. </td>
  54. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  55. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  56. </td>
  57. </tr>
  58. <tr>
  59. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  60. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  61. </td>
  62. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  63. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  64. </td>
  65. </tr>
  66. <tr>
  67. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  68. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  69. </td>
  70. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  71. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  72. </td>
  73. </tr>
  74. <tr>
  75. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  76. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  77. </td>
  78. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  79. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  80. </td>
  81. </tr>
  82. <tr>
  83. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  84. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  85. </td>
  86. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  87. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  88. </td>
  89. </tr>
  90. <tr>
  91. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  92. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  93. </td>
  94. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  95. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  96. </td>
  97. </tr>
  98. <tr>
  99. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  100. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  101. </td>
  102. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  103. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  104. </td>
  105. </tr>
  106. <tr>
  107. <td style="background-repeat: no-repeat; background-position: 0% 0%;" background="http://d2hforum.com/images/lmi.png" height="37" valign="center" width="333">
  108. &nbsp;&nbsp;&nbsp; <a href="http://d2hforum.com">Test 1</a>
  109. </td>
  110. <td style="background-repeat: no-repeat; background-position: 100%;" align="right" background="http://d2hforum.com/images/lmi2.png" height="37" valign="center" width="333">
  111. <a href="http://d2hforum.com">Test 2</a>&nbsp;&nbsp;&nbsp;&nbsp;
  112. </td>
  113. </tr>
  114. </tbody></table>
  115. </body>
  116. </html>

Advertencia, usé tu código tal cual esta, funciona pero tiene algunos errores.
Para el atributo valign no existe el valor center, será middle en todo caso.
estás usando el atributo background para las imágenes de fondo, deberías hacerlo todo en el style
style="background-image: url(http://d2hforum.com/images/lmi2.png);background-repeat: no-repeat; background-position: 0 0;"
como yo lo hice para<table>
Tu <tbody> es innecsario, solo se usa si se lo asocias a un thead y un tfoot, podés tambien simplificar todo tu código, dándole clases a las celdas y poner todo en un css, incluso vertical-align, text-align, y demás.

Te recomiendo que comiences con los manuales, por ejemplo
http://librosweb.es

SAludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.