table-row-group-3.html 955 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style>
  5. table {
  6. width: 300px;
  7. height: 300px;
  8. background-color: blue;
  9. }
  10. td {
  11. margin: 0;
  12. padding: 0;
  13. }
  14. #rel {
  15. position: relative;
  16. margin: 0;
  17. padding: 0;
  18. }
  19. #abs {
  20. position: absolute;
  21. margin: 0;
  22. padding: 0;
  23. top: 25px;
  24. left: 25px;
  25. width: 50px;
  26. height: 50px;
  27. background-color: green;
  28. }
  29. </style>
  30. </head>
  31. <body>
  32. The green square should not touch the blue square.
  33. <table>
  34. <thead>
  35. <tr>
  36. <td></td>
  37. <td></td>
  38. </tr>
  39. <tr style="height: 100%">
  40. <td></td>
  41. <td></td>
  42. </tr>
  43. </thead>
  44. <tbody id="rel">
  45. <tr>
  46. <td></td>
  47. <td>
  48. <div id="abs"></div>
  49. </td>
  50. </tr>
  51. </tbody>
  52. </table>
  53. </body>
  54. </html>