Почему в блоке не отображается две ссылки?

Question

[mih_max]

Здравствуйте.

Есть блок. В нём на фоне фото две ссылки: название материала и рубрика в которую этот материал входит. Работает только ссылка, которая находится ниже в коде. Почему так происходит и как сделать, чтобы обе ссылки вели в нужные места?

<article>
<span class="image">
<img src="cat.jpg" alt="cat" />
</span>
<header class="major">
<h3><a href="material" class="link">Материал</a></h3>
<p><a href="rubrika" class="link">Рубрика</a></p>
</header>
</article>

Answer 1

[Андрей Верх]

проблема в CSS, а не HTML

Comments

[mih_max]

https://html5up.net/forty - это шаблон в котором мне хотелось бы сделать кликабельной Tempus и Feugiat amet tempus (цветные блоки). Подскажите, пожалуйста, где в css можно поправить.

[Андрей Верх]

Вы не весь код выложили....там после header ещё ссылка есть, которая всё и перекрывает.

[mih_max]

Андрей Верх: совсем запутался. как же сделать так чтобы не перекрывала?

[Андрей Верх]

Удалить её, оставив только тот код что вы выложили. И ещё класс link с ссылок уберите

[mih_max]

Андрей Верх: да, удаление class="link" разрешило проблему. Спасибо.

[Андрей Верх]

mih_max: Нажмите тогда что Вопрос решён :)

Answer 2

[Максим]

span это строчный тег Но не блочный
можно вкладывать img в тег <p></p> но в <span><img src=""></span> это deprecated т.е работает по какому то не до разумению и валидатор выматерит вас за это хотя в html5 это уже не имеет значение но не стоит

Comments

[Андрей Верх]

Строчный в строчный, можно вкладывать без проблем