Despite being a common question, I am facing difficulties with Bootstrap 4, which may be due to some conflicts.
I am trying to create two divs placed one above the other, fixed to the bottom, with text centered in both.
Here is the code snippet:
<div class="row ">
<div class="myfooter text-center" style="display: inline-table;">
<div class="col-lg-12 col-md-12 ">
<div class="col-lg-6 col-md-6">
<span class='label label-default'>Copyright © 2018 Some Institute of Sciences, City, Country</span>
</div>
<div class="col-lg-6 col-md-6">
<span class='label label-default'>Developed By: Our Technologies (Pvt.) Ltd.</span>
</div>
</div>
</div>
</div>
And here is the accompanying style:
.myfooter {
position: fixed;
height: 30px;
bottom: 0;
width: 100%;
background-color: #21262929;
}
Issues:
If I change style="display: inline-table;" to another value like block, one of the divs disappears.
As I am not a designer, I would appreciate a ready-to-use solution. Thank you
Note: The Bootstrap footer class seems to be causing some issues that I can't pinpoint.