I've encountered an issue with centering icons in my HTML code. Despite trying to fix it myself, the icons always appear left-aligned. I would greatly appreciate any assistance from the helpful members of this community. It's likely a simple fix that I'm just overlooking.
HTML:
<div class="footerSection">
<div class="col-lg-4 col-md-4 col-sm-4 btn-toolbar">
...
</div>
</div>
CSS:
.footerSection {
width: 100%;
height: 100px;
background-color: #424242;
display: block;
position: fixed;
z-index: 999;
padding: 20px 0 20px;
bottom: 0;
}
#footerInside {
display: block;
float: left;
}
.divOuter {
margin: 0 auto;
}
.divCenter {
text-align: center;
}
Some notes on the code. The centered icons are normally hidden (display:none) until called upon to prevent taking up space.