Question: I am dealing with html writen long time ago and there is a problem with FireFox.  

Some tr elements have position property set to relative , which surprisingly makes the border of those tr's invisble. When I remove the style, it all works fine... so the question is:  

"**How does position:relative affect tr element?**" I can't get it.. for me it seems redundant.

Thanks

**EDIT:**

```
<table id="table1"  width="100%" cellspacing="0" cellpadding="0" border="0" bgcolor="#cccccc"><tbody>
<tr class="header" style="position:relative;top:2 px;">
    <th>sdf</th>
    <th>sdf</th>
    <th>sdf</th>
</tr>

.header {
    position:relative;
}

table#table1 {
    border-collapse: collapse;    
}

#table1 th {
    border-collapse: collapse;
    cursor: pointer;
    font-size: 8pt;
    padding: 3px;
    border-left: 1px solid #666666;
    border-right: 1px solid #666666;
    border-bottom: 1px solid #666666;
    color: #FFFFFF;
    background-color: #6685C2;
}

#table1 td {
    border-collapse: collapse;
    cursor: pointer;
    font-size: 8pt;
    padding: 3px;
    border: 1px solid #666666;
}

```

Answer: 
I'm also not entirely sure without seeing code, but:

From the spec: <http://www.w3.org/TR/CSS21/visuren.html#propdef-position>

> 
> The effect of 'position:relative' on table-row-group,
>  table-header-group, table-footer-group, **table-row,** table-column-group,
>  table-column, table-cell, and table-caption elements is undefined.
> 
> 
> 

`tr` is a `table-row`.
Use transform instead of position:

```
.header {
    transform: translateY(2px);
}

```