Как сделать ссылкой строку в таблице?

Question

[sazhyk]

<table>
   <tr>
      <td>00001</td>
      <td>Иванов И.И.</td>
    </tr>
   <tr>
      <td>00002</td>
      <td>Петров П.П.</td>
    </tr>
</table>

Собственно вопрос: как сделать так, чтобы строка таблицы была ссылкой?
Пока пришел вот к такому решению

<tr onclick="window.location.href='#'; return false">
   <td>00001</td>
   <td>Иванов И.И.</td>
</tr>

Но сам понимаю, что это как-то костыльно. Просто в данном контексте использование именно тега <table> было бы предпочтительнее.

Answer 1

[semki096]

Я бы так сделал.

<tr>
   <td><a style="display: block;" href="">00001</a></td>
   <td><a style="display: block;" href="">Иванов И.И.</a></td>
</tr>

Answer 2

[sazhyk]

Уболтал начальство не канифолить моск, а сделать по человечески, в дивах.
HTML-код

<div class="person_list_div">
	<a href="" class="person_list_row">
		<div class="person_list_number">00001</div>
		<div class="person_list_name">Иванов И.И.</div>
	</a>
	<a href="" class="person_list_row">
		<div class="person_list_number">00002</div>
		<div class="person_list_name">Петров П.П.</div>
	</a>
</div>

CSS-код

.person_list_div {
    display: table;
}

.person_list_row {
    display: table-row;
    text-decoration: none;
    transition: all 0.1s ease;
}

a.person_list_row:active,
a.person_list_row:visited {
    text-decoration: none;
    color: #000000;
}

a.person_list_row:hover {
    background-color: lightslategray;
    color: aliceblue;
}

.person_list_number,
.person_list_name {
    display: table-cell;
}

Оставлю это тут, может кому пригодится.
ЗЫ хотя если будут ещё какие интересные решения было бы познавательно глянуть.

Comments

[Сергей Софьичев]

лучше DIV в A не оборачивать

[sazhyk]

Сергей Софьичев: а какие могут быть последствия?

[Сергей Софьичев]

sazhyk: был случай кривого вывода новостей (news.list) из-за обертки в тег "a".

[sazhyk]

Сергей Софьичев: спасибо, учту. Но сайт внутрикорпоративный. Там вообще похерены многие правила. И пишется под сугубо конкретные задачи и бровзер. Но тем не менее за наводку спасибо.

[Сергей Софьичев]

sazhyk: пожалуйста =)

Answer 3

[0348raven]

На onclick вешать, по-другому неправильно будет.

Comments

[sazhyk]

То есть оставить как есть?

[0348raven]

sazhyk: ну если ты 'tr' в 'a' обернешь будет не кошерно.

[Сергей Софьичев]

0348raven: а если в таблице будут кликабельные элементы? тогда при клике на такие элементы, почти сразу сработает редирект

[sazhyk]

0348raven: мало того что не кошерно, это ещё и не работает. Тег .

[0348raven]

Сергей Софьичев: ну если в таблице будут кликабельные элементы, то делать это все не таблицей тогда видимо.

[0348raven]

sazhyk: Обрати внимание на вопрос Сергея, если такое возможно, то onclick не подойдет

[Сергей Софьичев]

0348raven: я понял, но заглядывая в будущее) На самом деле лучше с эмулировать таблицу и положить туда с абсолютом как по мне

[0348raven]

Сергей Софьичев: не, внутряк то понятно, что с абсолютом тогда будет в этом случае и да тогда эмулировать.

Answer 4

[Кирилл Петров]

<tr>
   <a href="#"><td>00001</td></a>
   <td>Иванов И.И.</td>
</tr>

Comments

[sazhyk]

Мне нужно чтобы ссылкой была строка

[Кирилл Петров]

sazhyk: 00001 Иванов И.И. было ссылкой?

[sazhyk]

Кирилл Петров: Извините, не понял вопроса.

<tr onclick="window.location.href='#'; return false">
   <td>00001</td>
   <td>Иванов И.И.</td>
</tr>

Эта конструкция кликабельна. Но мне она почему-то показалась костыльной.