Вход

Просмотр полной версии : А можно ли так верстать?

Сергей Ракипов
11.02.2021, 11:34
<a href="https://yandex.ru/">
<div>Тут див с какими то размерами фото и текстом. И возможно еще какой то еще div а может даже два</div>
</a>


То есть блок обернуть в ссылку.
Я просто слышал что лучше так не делать.
voraa
11.02.2021, 11:47
Тут проблема в оформлении.
Надо оформить так, что бы пользователь понимал, что все это одна ссылка и кликать можно по чему угодно, если надо перейти, и что это не просто какие то поясняющие тексты, а именно ссылки и что просто так по ним кликать не надо.
Сергей Ракипов
11.02.2021, 12:05
Тут проблема в оформлении.
Надо оформить так, что бы пользователь понимал, что все это одна ссылка и кликать можно по чему угодно, если надо перейти, и что это не просто какие то поясняющие тексты, а именно ссылки и что просто так по ним кликать не надо.

Я больше спрашивал с точки зрения верстки, что то из серии а если такие рекомендации так не делать.
То что пользователь поймет это согласен.
Aetae
11.02.2021, 12:13
<a> - inline-block.
block можно класть в inline-block.
Остальное вопрос конкретных гайдов и подходов.
Сергей Ракипов
11.02.2021, 12:23
Aetae,
То есть ссылки нужно сделать класс, где эту ссылку обозначить как inline-block

Если да а где это описано?
voraa
11.02.2021, 12:56
То есть ссылки нужно сделать класс, где эту ссылку обозначить как inline-block
Если нужен inline-block, то да. А так любой - ограничений нет
Aetae
11.02.2021, 13:56
Aetae,
То есть ссылки нужно сделать класс, где эту ссылку обозначить как inline-block
Нет. <a> - inline-block по умолчанию. В этом и суть. Нельзя класть блоки в inline по умолчанию(даже если переопределить классом).
voraa
11.02.2021, 15:12
<a> - inline-block по умолчанию. В этом и суть. Нельзя класть блоки в inline по умолчанию(даже если переопределить классом).

<a> - inline по умолчанию.
Класть то можно. Получается не так, как хотелось бы
А вот если <a> поставить inline-block, то все как надо

<body>
<a id=adef href="https://yandex.ru/">
<div style="position:relative;width:300px;height:200px;border: 1px solid red;background:#ffccff">
Тут див с какими то размерами фото и текстом. И возможно еще какой то еще div а может даже два
</div>
текст внутри a
</a>
<span>текст вне a</span>
<p></p>

<a id=ainbl href="https://yandex.ru/"style="display:inline-block;background:#ccffff">
<div style="position:relative;width:300px;height:200px;border: 1px solid red;">
Тут див с какими то размерами фото и текстом. И возможно еще какой то еще div а может даже два
</div>
текст внутри a
</a>
<span>текст вне a</span>
</body>
Aetae
11.02.2021, 20:12
А и правда, охренеть. Пора мне на пенсию, видать.