0

I have footer,where i have copyright mark with name and also instagram link, which i want align to the right. Nothing work, can you help me please? Im using bootstrap.

<footer class="text-center bg-dark py-3" style="color: white;">
  <span>name &nbsp</span><span style="color:#d64161">©2021 &nbsp</span><a href="https://www.instagram.com/dtd_quiz/" target="_blank"><i style="color: white;" class="fab fa-instagram"> instagram</i></a>
</footer>

enter image description here

Dominik Smolinský
  • 69
  • 5
  • remove `text-center` class from footer and add `text-right` – Minal Chauhan Apr 12 '21 at 08:34
  • Does this answer your question? [Bootstrap 4 align elements right inside a col div](https://stackoverflow.com/questions/43146263/bootstrap-4-align-elements-right-inside-a-col-div) – Masood Apr 12 '21 at 08:39

3 Answers3

2

change text-center to text-right

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css" integrity="sha512-P5MgMn1jBN01asBgU0z60Qk4QxiXo86+wlFahKrsQf37c9cro517WzVSPPV1tDKzhku2iJ2FVgL67wG03SGnNA==" crossorigin="anonymous" />

<footer class="text-right bg-dark py-3" style="color: white;">
   <span>name &nbsp</span><span style="color:#d64161">©2021 &nbsp</span>
   <a href="https://www.instagram.com/dtd_quiz/" target="_blank">
      <i style="color: white;" class="fab fa-instagram"> instagram</i>
   </a>
</footer>
frankfurt
  • 143
  • 1
  • 5
  • 23
1

There are 2 ways to do it.

  1. Use text-right class on footer element,
  2. on the first span give these 2 classes: d-inline-block and ml-auto and d-flex to footer;

I would suggest the first one.

please let me know if this won't help.

Atul Rajput
  • 4,073
  • 2
  • 12
  • 24
0

Add this CSS

footer.text-center.bg-dark.py-3 {
    text-align: right !important;
}
DesignerWWT
  • 23
  • 1
  • 8
  • its not advisable, if you already have a class in bootstrap to do your things, why to write custom css? – Atul Rajput Apr 12 '21 at 08:39
  • Yes but if he doesn't know about that. I also know that there is a class. he also has that option so it is up to him. I gave him one solution. – DesignerWWT Apr 13 '21 at 04:29