Posted By

localhorst on 05/06/09


Tagged

safari bug workaround


Versions (?)

safari double cellspacings when is used.


 / Published in: CSS
 

this is a lazy fix for a problem I came across. safari doubles the border spacing to divide table cells when using tbody ( I cant use borders+collapse, because of rounded tablecells :( )

  1. <style>
  2. td {
  3. background-color: green
  4. }
  5.  
  6. table {
  7. border: 1px solid white;
  8. }
  9.  
  10. /* switch just for safari */
  11. @media screen and (-webkit-min-device-pixel-ratio:0)
  12. {
  13. table
  14. {
  15. border: 1px solid white;
  16. -webkit-border-vertical-spacing: 3px;
  17. padding-top: 2px;
  18. }
  19. }
  20.  
  21. </style>
  22.  
  23.  
  24. <table width="300" border="0" cellspacing="5" cellpadding="0">
  25. <tbody>
  26. <tr>
  27. <td><h1>with tbody tag</h1>
  28. </td>
  29. <td>dfhdfh
  30. </td>
  31. <td>ggg
  32. </td>
  33. <td>hdhd
  34. </td>
  35. <td>dfhdfh
  36. </td>
  37. </tr></tbody>
  38. <tbody>
  39. <tr>
  40. <td><h2>see the space above</h2>
  41. </td>
  42. <td>
  43. </td>
  44. <td>hdfhdfh
  45. </td>
  46. <td>
  47. </td>
  48. <td>dfhdfh
  49. </td>
  50. </tr>
  51. </tbody>
  52. </table>

Report this snippet  

You need to login to post a comment.