footer align not working

Topic: footer align not working

psarmaputra7 pro asked 6 years ago

i am trying simple footer but its not working.

  <!--Footer--> <footer class="page-footer teal center-on-small-only pt-0"> <!--Copyright--> <div class="footer-copyright"> <div class="container white-text"> <p class="pull-left">© Company 2014</p> <div class="pull-right"> <ul class="right"> <li><a href="#">Pricing</a></li> <li><a href="#">Contact</a></li> <li><a href="#">Terms</a></li> </ul> </div> </div> </div> <!--/Copyright--> </footer> <!--/Footer-->

https://i.imgur.com/kAeZw52.png Left company is working good but right side of anchor tags are not showing.

Add comment

Marta Wierzbicka staff answered 6 years ago

0 0 Best answer

Hi, change this <div class="d-flex justify-content-end"> to this <div class="d-md-flex justify-md-content-end">. Best, Marta

psarmaputra7 pro commented 6 years ago

can you suggest me via code, as the above method works but for mobile devices it's not good? My requirement for the footer is really very simple: One copyright text at leftmost center empty right mode 3 links(t&c, privacy, DMCA) in the same row of copyright text. Hope that will not take much time for you.

Add comment

psarmaputra7 pro answered 6 years ago

0 0 Best answer

<footer class="page-footer teal center-on-small-only pt-0 fixed-bottom">

<div style="height: auto;" class="footer-copyright white-text">
<div class="container-fluid">

<div class="mr-auto p-2">
© 2015-18, Webenlance, All rights reserved
</div>

<ul class="list-inline">
<li class="list-inline-item"><a href="/privacy">Privacy Policy</a></li>
<li class="list-inline-item"><a href="/term">Terms of Service</a></li>
<li class="list-inline-item"><a href="/dmca">DCMA</a></li>
<li class="list-inline-item"><a href="/refund">Refund Policy</a></li>
</ul>
</div>

</div>
</div>

</div>

</footer>

hi, I have currently two problems :

1st.  if I try to check footer for responsive, it not works.

2nd. I am also using fixed-bottom footer for lesser contents page but the problem is again with the responsiveness of page.

<a href="https://imgur.com/a/YXc5R" rel="nofollow">https://imgur.com/a/YXc5R</a>

Please insert min. 20 characters.

<footer class="page-footer teal center-on-small-only pt-0 fixed-bottom">  <div style="height: auto;" class="footer-copyright white-text"> <div class="container-fluid"> <div class="d-flex justify-content-end"> <div class="mr-auto p-2"> © 2015-18, Webenlance, All rights reserved </div> <div class="p-2"> <ul class="list-inline"> <li class="list-inline-item"><a href="/privacy">Privacy Policy</a></li> <li class="list-inline-item"><a href="/term">Terms of Service</a></li> <li class="list-inline-item"><a href="/dmca">DCMA</a></li> <li class="list-inline-item"><a href="/refund">Refund Policy</a></li> </ul> </div> </div> </div> </div>  </footer> hi, I have currently two problems : 1st. if I try to check footer for responsive, it not works. 2nd. I am also using fixed-bottom footer for lesser contents page but the problem is again with the responsiveness of page. https://imgur.com/a/YXc5R

Add comment

Marta Wierzbicka staff answered 6 years ago

0 0 Best answer

Hi, it is not visible because you put <ul></ul> to the .footer-copyright class which has height: 50px;. If you want to have your <ul></ul> visible, you need to change the height to height: auto;. Best, Marta

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

ForumUser: Pro
Premium support: No
Technology: General Bootstrap questions
MDB Version: -
Device: -
Browser: -
OS: -
Provided sample code: Yes
Provided link: Yes

psarmaputra7

Pro User 10Support score
2Questions 1Answers 0Snippets