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

Question

[Евгений Иванов]

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

....
<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>

Answer 1

[alex]

дать якорь самой строке <tr id="anchor">...</tr>

spoiler

<nav>
  ...
  <a href="#el_721">el_721</a>
  <a href="#el_722">el_722</a>
  <a href="#el_723">el_723</a>
  ...
</nav>

<table>
  <tbody>
    ...
    <tr id="el_721">
      <td>el_721</td>
      <td>el_721</td>
    </tr>
    <tr id="el_722">
      <td>el_722</td>
      <td>el_722</td>
    </tr>
    <tr id="el_723">
      <td>el_723</td>
      <td>el_723</td>
    </tr>
    ...
  </tbody>
</table>

Answer 2

[Максим Тимофеев]

берем jquery и пишем:
https://www.w3schools.com/JQuery/css_scrolltop.asp
1stwebmagazine.com/jquery-scroll-to-anchor-point

Answer 3

[Егор Живагин]

А почему бы не

td {
position: relative;
}
a {
position: absolute;
top: 0px;
left: 0px;

?