-2

Screen shot of problem I am trying to get rid of this annoying blue color in my Bootstrap button supported with Bootstrap. First, there was an underline with blue color, but when add text-decoration: none underline is cleared but still blue color.

<style type="text/css">
      a, a:link, a:visited, a:hover { text-decoration:none; }
      </style>



      <button type="button" class="btn btn-outline-dark">
            <a href="https://www.instagram.com/freyahomebodrum_mertticaret/"
              target="_blank">Instagram</a>
          </button>

But I still have the blue color as in the screenshot. I have tried variations using span but that does not help either. Am I doing something wrong above?

Thank you in advance.

ww6jdr
  • 7
  • 1

2 Answers2

0

try this change the color property of anchor tag like this.

a{
 color: #000; /* this will change the color to black
}
  • This worked very well, but why text-decoration: none; is not worked in this case. Thank you – ww6jdr Feb 12 '22 at 15:12
  • because text-decoration property is used for decorating line like underline, overline under the text not for coloring the text for that we use color property, and if you use text-decoration-color property it will color the line not text. – Dhanveer yadav Feb 12 '22 at 15:21
-1

You can apply class="btn btn-outline-dark" to the <a> tag itself, removing the <button> altogether. Bootstrap's documentation includes an example with <a>.