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

Question

[Михаил]

Всем привет. Ситуация следующая. Есть карточка товара, как сделать так, чтобы вся карточка была ссылкой. Обернуть все содержимое карточки в ссылку это ведь не совсем правильно? Каким ещё способом можно это сделать?

Comments

[Владимир]

Почему нет ?

[Михаил]

Владимир, т.е. обернуть все содержимое в ссылку это нормально? Мне казалось, что есть ещё какой-то способ. Спасибо, тогда так и сделаю.

[Михаил]

:K Yaha, А как тогда правильно сделать, чтобы интерактивность была рабочей?

[Владимир]

Михаил, Вопрос поставлен неправильно, так как на карточке есь интерактивные элементы, то всю карточку никак не получится сделать ссылкой, откройте пейнт и обведите карандашиком, какие области на карточке должны работать как интерактивные, а какие должны быть ссылкой. И тогда вы будете знать что оборачивать в ссылку, а что нет (подозреваю что картина с описанием - ссылка, а все что ниже - нет)

Answer 1

[HamSter]

Можно задать карточке position:relative,
a ссылке - position:absolute;

Пример на jsbin

.card {
  position: relative;
}

.card-link {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}