Insertion logos sociaux

**Media20** · 05/09/2021, 17h10

Bonjour a toutes et a tous

J'aimerais integrer des logos sociaux en bas du footer.
Mais la je bloque..
Si vous avez la soluce merci d'avance..

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<footer class="footer">
<div class="container bottom_border">
<div class="row">
<div class=" col-sm-4 col-md col-sm-4  col-12 col">
<h5 class="headin5_amrc col_white_amrc pt2">Find us</h5>
<!--headin5_amrc-->
<p class="mb10">Coordonnées</p>
<p><i class="fa fa-location-arrow"></i> 9878/25 sec 9 rohini 35 </p>
<p><i class="fa fa-phone"></i>  +91-9999878398  </p>
<p><i class="fa fa fa-envelope"></i> info@example.com  </p>
</div>
<div class=" col-sm-4 col-md  col-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Quick links</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li><a href="#">AA</a></li>
<li><a href="#">AA</a></li>
<li><a href="#">AA</a></li>
<li><a href="#">AA</a></li>
<li><a href="#">AA</a></li>
<li><a href="#">AA</a></li>
</ul>
<!--footer_ul_amrc ends here-->
</div>
<div class=" col-sm-4 col-md  col-6 col">
<h5 class="headin5_amrc col_white_amrc pt2">Liens rapides</h5>
<!--headin5_amrc-->
<ul class="footer_ul_amrc">
<li><a href="#">AA</a></li>
<li><a href="#">BB</a></li>
<li><a href="#">CC</a></li>
<li><a href="#">DD</a></li>
<li><a href="#">EE</a></li>
<li><a href="#">FF</a></li>
</ul>
<!--footer_ul_amrc ends here-->
</div>
<div class=" col-sm-4 col-md  col-12 col">
<h5 class="headin5_amrc col_white_amrc pt2">Partenaires</h5>
<!--headin5_amrc ends here-->
<ul class="footer_ul2_amrc">
<li><a href="#"><i class="fab fa-twitter fleft padding-right"></i> </a><p>aa<a href="#"></a></p></li>
<li><a href="#"><i class="fab fa-twitter fleft padding-right"></i> </a><p><a href="https://www.centrale-canine.fr/" target="_blank">BBB/</a></p></li>
<li><a href="#"><i class="fab fa-twitter fleft padding-right"></i> </a><p><a href="#">CCC</a></p></li>
</ul>
<!--footer_ul2_amrc ends here-->
</div>
</div>
</div>
<div class="container">
<ul class="foote_bottom_ul_amrc">
<li><a href="../index.html">Acceuil</a></li>
<li><a href="a_propos.html">A propos</a></li>
<li><a href="https://1-place-michel-monta.forumactif.com/">Forum</a></li>
<li><a href="mentions_legales.html">Mentions légales</a></li>
<li><a href="../conditions-generales-dutilisation.html">Conditions generales</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
<!--foote_bottom_ul_amrc ends here-->
<p class="text-center">Copyright @2021 | Designed by <a href="#">MediAssistance with Bootstrap</a></p>
 
<ul class="social_footer_ul">
<li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
<li><a href="#"><i class="fab fa-twitter"></i></a></li>
<li><a href="#"><i class="fab fa-linkedin"></i></a></li>
<li><a href="#"><i class="fab fa-instagram"></i></a></li>
</ul>
<!--social_footer_ul ends here-->
</div>
</footer>

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
/*footer*/
.col_white_amrc { color:#FFF;}
footer { width:100%; background-color:white; min-height:250px; padding:10px 0px 25px 0px ;}
.pt2 { padding-top:40px ; margin-bottom:20px ;}
footer p { font-size:13px; color:#CCC; padding-bottom:0px; margin-bottom:8px;}
.mb10 { padding-bottom:15px ;}
.footer_ul_amrc { margin:0px ; list-style-type:none ; font-size:14px; padding:0px 0px 10px 0px ; }
.footer_ul_amrc li {padding:0px 0px 5px 0px;}
.footer_ul_amrc li a{ color:#010101;}
.footer_ul_amrc li a:hover{ color:#fff; text-decoration:none;}
.fleft { float:left;}
.padding-right { padding-right:10px; }
 
.footer_ul2_amrc {margin:0px; list-style-type:none; padding:0px;}
.footer_ul2_amrc li p { display:table; }
.footer_ul2_amrc li a:hover { text-decoration:none;}
.footer_ul2_amrc li i { margin-top:5px;}
 
.bottom_border { border-bottom:1px solid #323f45; padding-bottom:20px;}
.foote_bottom_ul_amrc {
	list-style-type:none;
	padding:0px;
	display:table;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}
.foote_bottom_ul_amrc li { display:inline;}
.foote_bottom_ul_amrc li a { color:#999; margin:0 12px;}
 
.social_footer_ul { display:table; margin:15px auto 0 auto; list-style-type:none;  }
.social_footer_ul li { padding-left:20px; padding-top:10px; float:left; }
.social_footer_ul li a { color:#CCC; border:1px solid #CCC; padding:8px;border-radius:50%;}
.social_footer_ul li i {  width:20px; height:20px; text-align:center;}
 
a:link { color: #959392;
         font-weight: bold;
         text-decoration:none; 
}
h1 { text-align: center;}