CSS Background color overlaps with frame on table cell in IE

Question

I have a table with two simple table cells:

<table> <tr> <td>Test1</td> </tr> <tr> <td>Test2</td> </tr> </table> 

And I will add the following CSS to the table cells:

 td { border: 1px solid #000; background-color: #CCC; } 

For some reason, when I look at this in IE, it shows the background at the top of the border, if I remove the background in the DOM Explorer, I see that there is a border.

I suppose this has something to do with the parent element, but there are many different parent elements into which I cannot paste all this code.

Does anyone have an idea what this could be?

Answer 1

if you do not want to change positioning, try

 background-clip: padding-box; 

Answer 2

as I expected, it was because of the position rule in css: td {position: relative} I don’t know why this is, but eliminating it, allowing it

took me forever to narrow it down, so I started this post in the first place to save time. but now fixed :)