Anchor tag not working in sceen size below 768px

I have create a page with simple HTML, the anchor tag is not working when I reduce screen size. I have tested in all browser.

Here is the HTML code I have added.

<div class="home_slider_side">
	<div class="sign_up"><a id="sign_up" href="https://example.com"><img src="https://localhost/axample/wp-content/uploads/2016/08/a.jpg" alt="Text"></a></div>
	<div class="shop_now"><a href="https://example.com/"><img style="margin-top: 20px; border:1px #dc1e28 solid;" src="https://localhost/axample/wp-content/uploads/2016/08/b.jpg" alt="text"></a></div>
</div>
<div class="promotion">
	<h2 style="padding-top:10px;padding-bottom:20px;">Heading/h2>
	<div class="col_price col_home_1">
		<i class="fa fa-inr icon_price"></i><h4>Some text</h4>
		<div class="price"><p>Some more text</p></div>
	</div>
	<div class="col_home_1 col_prepare">
		<i class="fa fa-cutlery icon_prepare"></i><h4>Some text</h4>
		<p class="prepare">Some more text.</p>
	</div>
	<div class="col_home_1 col_send">
		<i class="fa fa-send icon_send"></i><h4>Some text</h4>
		<p class="send">Some more text.</p>
	</div>
	<div class="col_home_1 col_delivery">
		<i class="fa fa-truck icon_delivery"></i><h4>Some text</h4>
		<p class="delivery">Some more text.</p>
	</div>
</div>

<div class="cat_home">
<h2 style="font-size: 30px; padding-top: 10px;padding-bottom: 20px;">Heading</h2>
	<div class="col_categories">
		<a href="#">
			<div class="cat-img"><img src="https://localhost/axample/wp-content/uploads/2016/08/1a.png" alt="1a"></div>
			<div class="title-wrap">
				<span class="cat-title">A</span>
				<span class="cat-sub-title">Some more text</span>
			</div>
		</a>
	</div>
	<div class="col_categories">
		<a href="#">
			<div class="cat-img"><img src="https://localhost/axample/wp-content/uploads/2016/08/1b.jpg" alt="1b"></div>
			<div class="title-wrap">
				<span class="cat-title">B</span>
				<span class="cat-sub-title">Some more text</span>
			</div>
		</a>
	</div>
	<div class="col_categories">
		<a href="#">
			<div class="cat-img"><img src="https://localhost/axample/wp-content/uploads/2016/08/1c.jpg" alt="1c"></div>
			<div class="title-wrap">
				<span class="cat-title">C</span>
				<span class="cat-sub-title">Some more text</span>
			</div>
		</a>
	</div>
	<div class="col_categories">
		<a href="#">
			<div class="cat-img"><img src="https://localhost/axample/wp-content/uploads/2016/08/1d.jpg" alt="1d"></div>
			<div class="title-wrap">
				<span class="cat-title">D</span>
				<span class="cat-sub-title">Some more text</span>
			</div>
		</a>
	</div>
</div>

1. Anchor tag not working in the div class “home_slider_side”, “cat_home”
2. Hover effect not working in div class “promotion”

Please help me out in fixing this issue.