Can't click on links of my footer on mobile version - html

Question

For my work I had to create a custom homepage for an existing Wordpress website. Since my boss liked my footer I had to implement my own footer in the theme used.
My footer works fine but in mobile version, I can't click on links...
Here is the website: website
Does anyone have an idea ?
<div class="container">
<div class="col-xs-12 col-sm-6 col-md-3 text-left footer-column">
<h3>EB Quad</h3>
<ul>
<li>Accueil</li>
<li>Atelier</li>
<li>Occasions</li>
<li>Contact</li>
<li>Livre d'or</li>
</ul>
</div>
<div class="col-xs-12 col-sm-6 col-md-3 text-left footer-column">
<h3>CF Moto</h3>
<ul>
<li>Quads</li>
<li>Buggys</li>
</ul>
</div>
<div class="col-xs-12 col-sm-6 col-md-3 text-right footer-column">
<h3>Randonnées</h3>
<ul>
<a href="https://www.ebquad.be/randonnees/">
<li>Nos randonnées</li>
</a>
<li>Agenda</li>
<li>Photos</li>
<li>Informations/Tarifs</li>
</ul>
</div>
<div class="col-xs-12 col-sm-6 col-md-3 text-right footer-column">
<h3>Informations</h3>
<ul>
<li><a href="https://www.google.com/maps/place/E.b.+Renove/#50.3840829,4.0316377,15z/data=!4m2!3m1!1s0x0:0xe36a2bfccc6eb3da?ved=2ahUKEwj5r93ciZjfAhVQNOwKHfAYCtQQ_BIwDXoECAYQCA" target="_blank" rel="noopener noreferrer">
Route de Beaumont 10<br>
7041 Givry (Mons)</a></li>
<li>info#eri-renove.be</li>
<li>0495/447.304</li>
</ul>
</div>
<!-- .footer-widget-wrap -->
<div class="col-xs-12 col-sm-12 col-md-12 text-center">
<div style="font-size:12px; margin:auto; text-align:center;">Site réalisé par:</div>
<a href="http://www.mds-digitalagency.be" class="watermark-link" target="_blank"><img src="https://www.ebquad.be/wp-content/uploads/2018/12/mds_logo.png"
style="width: 64px; margin-bottom:30px;" alt=""></a>
</div>
<div class="footer-bottom-wrap col-md-12">
EB QUAD © Tous droits réservés | Conditions générales
</div><!-- .footer-bottom-wrap -->
</div><!-- container -->
Thanks

Answer 1

Your .footer-bottom-wrap covers the whole footer. Add display: inline-block to this element and all works fine.

Answer 2

Add this css inside your stylesheet
.footer-bottom-wrap {float: left;}

Answer 3

Since your links are float elements they aren't displayed as the normal flow, and your .foote-bottom-wrap elemnt is not a float element this is why this element will cover all of your links.. you can fix it using this class..
.footer-bottom-wrap {
...
overflow:hidden;
}
This property fix this behavior.. you can find a good tutorial to understand float behavior here

Answer 4

Add this in your style.css line number 380 "overflow: hidden;"

Answer 5

It's caused by your css code just try to add
via HTML
<div class="clearfix"></div>
<!--before-->
<div class="footer-bottom-wrap col-md-12">
Or via CSS
.footer-bottom-wrap {
color: #787977;
overflow: hidden;
}