HTML <tr> тег и позиция: относительная
Я имею дело с html writen давно, и есть проблема с FireFox.
Некоторые элементы tr имеют свойство position, заданное относительным, что на удивление делает границу этих tr invisble. Когда я удаляю стиль, все работает отлично... так что вопрос:
" Как позиция: относительный влияет на элемент tr? " Я не могу это получить.. для меня это кажется излишним.
благодаря
РЕДАКТИРОВАТЬ:
<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;
}
Ответы
Ответ 1
Я также не совсем уверен, не видя кода, но:
Из спецификации: http://www.w3.org/TR/CSS21/visuren.html#propdef-position
Эффект "position: relative" в группе table-row-group, table-header-group, table-footer-group, table-row, table-column-group, table-column, table-cell и table-caption не определено.
tr
- table-row
.
Ответ 2
Взаимодействие, вероятно, та позиция: relative отключает свойство border-collapse. Конечно, не видя никакого кода, это довольно сложно сказать.
Обновление. Если вы посмотрите на свой код, вы увидите, что у рассматриваемого tr никогда не было собственной границы. Настройка position: relative
влияет на отображение на th
элементов. Я предлагаю вам положить это на неопределенное поведение.
Если вам нужно позиционировать строку относительно, то я предлагаю вам также изменить ее свойство отображения на одно подходящее для относительного позиционирования.
Ответ 3
Используйте преобразование вместо позиции:
.header {
transform: translateY(2px);
}