Images overlapping in chrome - html

Question

I am using a free template to build a website. The template is great. But I realize that images are overlapping in chrome browser.
It should look like this;
but the actual situation is;
I think it is a js issue but I don't know how to solve it. How could I manage to make it working in chrome too?
Edit: Sorry to forget adding codes
<div class="container page-content">
<!-- #options -->
<div id="container" class="row portfolio-grid-textblock">
<div class="col-md-4 col-sm-6 element wordpress ui-design" data-symbol="Mg" data-category="wordpress">
<a href="portfolio-item-style2.html">
<div class="image-link">
<img alt="Reponsive Style" src="img/PortfolioImg/astrolojiler-home.jpg"/>
</div>
<div class="portfolio-texbox">
<h5>ASTROLOJİLER</h5>
<p>
Burç yorumları, yükselen burçlar, çin astrolojisi, hint astrolojisi...
</p>
</div>
</a>
</div>
<div class="col-md-4 col-sm-6 element actinoid bootstrap" data-symbol="U" data-category="actinoid">
<a href="portfolio-item-style2.html">
<div class="image-link">
<img alt="Reponsive Style" src="img/PortfolioImg/numeroloji-home.jpg"/>
</div>
<div class="portfolio-texbox">
<h5>NÜMEROLOJİ</h5>
<p>
Sayı bilimi, aşk uyumu ve harflere karşılık gelen rakamlar...
</p>
</div>
</a>
</div>
<div class="col-md-4 col-sm-6 element lanthanoid bootstrap" data-symbol="Gd" data-category="lanthanoid">
<a href="portfolio-item-style2.html">
<div class="image-link">
<img alt="Reponsive Style" src="img/PortfolioImg/fallar-home.jpg"/>
</div>
<div class="portfolio-texbox">
<h5>FALLAR</h5>
<p>
Kahve falı, tarot falı, el falı, renk falı, zar falı, çiçek falı, niyet falı ve daha birçok fal...
</p>
</div>
</a>
</div>
<div class="col-md-4 col-sm-6 element wordpress ui-design" data-symbol="Y" data-category="wordpress">
<a href="portfolio-item-style2.html">
<div class="image-link">
<a href="portfolio-item-style2.html">
<div class="image-link">
<img alt="Reponsive Style" src="img/PortfolioImg/biyoritim-home.jpg"/>
</div>
<div class="portfolio-texbox">
<h5>BİYORİTİM</h5>
<p>
Biyoritim değerlerinizi günlük olarak görmek için buraya tıklayın...
</p>
</div>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6 element" data-symbol="B" data-category="ui-design">
<a href="portfolio-item-style2.html">
<div class="image-link">
<img alt="Reponsive Style" src="img/PortfolioImg/ruya-tabirleri-home.jpg"/>
</div>
<div class="portfolio-texbox">
<h5>RÜYA TABİRLERİ</h5>
<p>
Rüyanızda gördüğünüz şeyler ne anlama geliyor öğrenmek için tıklayın...
</p>
</div>
</a>
</div>
<div class="col-md-4 col-sm-6 element wordpress ui-design" data-symbol="Fe" data-category="wordpress">
<a href="portfolio-item-style2.html">
<div class="image-link">
<img alt="Reponsive Style" src="img/PortfolioImg/karakter-analizi-home.jpg"/>
</div>
<div class="portfolio-texbox">
<h5>KARAKTER ANALİZİ</h5>
<p>
Nasıl bir karakteriniz var? Karakterinizi belirleyen etkenler nelerdir?...
</p>
</div>
</a>
</div>
</div><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ae-yeni-alt -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-2108313464701654"
data-ad-slot="9514974529"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<!-- Dotted line between footer -->
<hr class='dotted'/>
<footer class="below-footer">
<div class="container ">
<div class="pull-right smalllogo">
<div>
<!--<i class="fa fa-dot-circle-o"></i> SkyWay-->
</div>
</div>
<a id="scrolltotop" href="#" class="btn btn-default btn-sm"><i class="fa fa-angle-up fa-2x"></i></a>
<p>
© 2011-2015 AstroEnerji.com Kullanım Koşulları | Gizlilik Bildirimi
</p>
</div>
</footer>
<!-- End of footer -->
</div>
</div>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.easing.js"></script>
<script src="js/jquery.prettyPhoto.js"></script>
<script src="vendor/isotope/jquery.isotope.min.js"></script>
<script src="vendor/isotope/js/fake-element.js"></script>
<script src="js/site.js"></script>

Answer 1

You've got something screwy going on in the 4th box -- the one with data-symbol="Y"
<div class="col-md-4 col-sm-6 element wordpress ui-design" data-symbol="Y" data-category="wordpress">
=> <a href="portfolio-item-style2.html">
=> <div class="image-link">**
<a href="portfolio-item-style2.html">
<div class="image-link">
<img alt="Reponsive Style" src="img/PortfolioImg/biyoritim-home.jpg"/>
</div>
<div class="portfolio-texbox">
<h5>BİYORİTİM</h5>
<p>Biyoritim değerlerinizi günlük olarak görmek için buraya tıklayın...</p>
</div>
</a>
</div>
**extra div here => </div>
If you take out the two lines that I put a => in front of, that should fix it.
I think you also have an extra tag at the end of that block. Remove that also.
If that doesn't fix it then we'll need to see the issue on a full html page, on bootply, jsfiddle, or your server, etc.