Как сделать ссылку на div без внешних изменений?

Question

[Иван Бабий]

Необходимо 2 блока сделать гиперссылками. При таком подходе:

<div class="col-md-6 block1"><a href="launcher.html" ></a></div>
			<div class="col-md-6 block2"><a href="index.html"></a></div>

ссылки разумеется не работают и выглядит сайт без изменений ( что блоки гиперссылками, что нет )


Когда немного видоизменяю код:

<a href="launcher.html" ><div class="col-md-6 block1"></div></a>
			<a href="index.html"><div class="col-md-6 block2"></div></a>

получается такая картина ( при чем ссылок тоже на сайте нигде не наблюдается )

Стоит учесть что у меня уже используются стили для a:

a {text-decoration: none; color: #1dfe94;}
			a:hover {text-decoration: none; color: #1dfe94;}
	  		a:active {text-decoration: none; color: #85A6BD;}

но убирать мне их из кода никак нельзя.

Как решить такую проблему, и сделать блоки гиперссылками без внешних изменений?

Answer 1

[Андрей Б.]

.block1 a, .block2 a {
   display: block;
   height: 100%;
}

Ссылка это строчный элемент, т.к. у вас нет текста в них, то размеры получается нулевые.
В первом примере вы не можете кликнуть, потому что некуда.
Во втором примере, картинок не видно потому что размеры ссылки опять же нулевые. Если в этом примере у дивов нет явно указанных размеров то они "схлопываются". И вообще вставлять в ссылку блочный элемент не рекомендуется.

Comments

[Иван Бабий]

Если можно, кодом, потому как я и задавал вопрос не просто так

[Иван Бабий]

Спасибо вам большое