Задать вопрос

Как создать ссылку — якорь выше ячейки?

Есть таблица с несколькими строками и столбцами.
В каждой строке (в первой ячейке строки) есть ссылка-якорь.

....
<tr>
<td><a name="el_1'"></a>Текст</td><td>Ещё текст</td>
</tr>
<tr>
<td><a name="el_2'"></a>Текст</td><td>Ещё текст</td>
</tr>
<tr>
<td><a name="el_3'"></a>Текст</td><td>Ещё текст</td>
</tr>
.....

Пользователь нажимая на ссылку вида index.html#el_333 "прокручивает" документ до нужной ссылки якоря.
Но - у таблицы есть оформление, а именно отступы, границы. Текст в ячейке таблицы, расположен по середине (вертикальное выравнивание).
Итого текст "свободно" располагается в ячейке - сверху и снизу ещё есть место (padding).

При переходе по ссылке index.html#el_333, пользователь "прокручивает" документ до нужной ссылки якоря и видит текст, начиная с его начала. Где начинается ссылка, там и начало "экрана браузера".
Где начинается ссылка, а ни где начинается ячейка.

Так, как текст вертикально выровнен по центру (middle) и выше и ниже в ячейке есть свободное место (padding), пользователь видит только часть ячейки - начиная с текста и всё что ниже.

Как сделать так, чтобы при переходе по ссылке, пользователь видел страницу не с начала текста, а с начала ячейки, где расположен этот текст? Т.е. якорь должен быть выше ячейки, но где?

Наподобие вот такого (конечно это не работает, но суть думаю ясна)
<tr>
<a name="el_1'"></a>
<td>Текст</td><td>Ещё текст</td>
</tr>
  • Вопрос задан
  • 1187 просмотров
Подписаться 1 Оценить Комментировать
Ответ пользователя Егор Живагин К ответам на вопрос (3)
Krasnodar_etc
@Krasnodar_etc
fundraiseup
А почему бы не
td {
position: relative;
}
a {
position: absolute;
top: 0px;
left: 0px;

?
Ответ написан
Комментировать