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

Question

Вот HTML:

<table>
    <thead>
        <th><a href="...">Number</a></th>
        <th><a href="...">Description</a></th>
    </thead>
    <tbody>
        <td><a href="...">1234</a></td>
        <td>... description</td>
    </tbody>
</table>

Теперь добавление отступов к table a { display: block; padding: 5px; } вызывает проблемы, когда я хочу добавить такой же отступ к тд table td { padding: 5px; }. Может быть, я перестал использовать прокладку?

Я обошел это несколькими способами, выполнив: <th><a href="...">1234</a></th> и затем css применяется только к th-элементам, а не к td. И я также добавил class="nolink", но я чувствую, что методология th немного более семантическая, чем использование класса, описывающего его содержание.

Все это происходит из-за проблемы, заключающейся в том, что в CSS (с которым я знаком) нет никакого способа сказать, стилизовать все тд одним способом , если якорь не является потомком. Я заметил селектор :not в CSS3, но я не уверен, что понимаю, как его использовать в этом случае?

Обновление: Проблема действительно в том, что заполнение добавляется дважды в ячейки с тегом привязки

Я не очень хорошо объяснил реальную проблему, пожалуйста, посмотрите это:

http://cssdesk.com/VCtfN

Вы заметите заполнение при наведении на ссылки.

Answer 1

Я вижу два решения этой проблемы:

1. Добавьте заполнение к td и th, но не к a. Demo
2. Инкапсулируйте весь контент без привязки с некоторым элементом блока с помощью 5px padding и удалите все отступы из td / th. Демо

Answer 2

Теги

A являются встроенными элементами.Используйте display:block, если вы хотите использовать поля и отступы.

table a { padding: 5px; display:block }