-1

I created social media icons in my navbar as below. It works fine in my browsers (Chrome, Edge) but for my partner, in South Africa: it does not show at all for them, using the same browsers.

  <!-- Bootstrap core CSS -->
  <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <!-- Custom styles for this template -->
  <link href="css/modern-business.css" rel="stylesheet">
  <link rel="stylesheet" href="css/font-awesome.min.css">

Within NAVBAR:

        <ul class="social-icons">
          <li><a href="https://www.facebook.com/womensrugbyinc"  target="_blank" class="fa fa-facebook"></a></li>
          <li><a href="#" class="fa fa-twitter"></a></li>
          <li><a href="https://www.instagram.com/girlpower_rugbyacademy/" target="_blank" class="fa fa-instagram"></a></li>
        </ul>

Custom CSS:

.social-icons {
  padding: 0px;
  margin: 0px;
    }
.social-icons li {
  display: inline-block;
  list-style: none;
  background: #00917C;
  margin: 10px 0px 0px 0px;
  border-radius: 5px;
    }
.social-icons li a {
  color: #FFFFFF;
  text-decoration: none;
  font-size: 20px;
  padding: 10px 15px;
  text-align: center;
  transition: all 0.4s ease-in;
    }
.social-icons li a:hover {
  background: #d54ab6;
  color: #fff;
    }

As currently displayed, it works fine in my browsers, here in the USA. So strangely enough, it does not work in my partners browser in South Africa.

MrUpsidown
  • 21,592
  • 15
  • 77
  • 131
GaryCoetzee
  • 1

1 Answers1

0

As i tried to display them on my pc, they aren't displayed on one of my browsers. So i moved this outside of it and it wont display it. Then i tried to change the a to i and it wont display. So on, the problem must be that the css sheet of font-awesome isn't properly loaded into it or they are premium icons. I don't know if that's correct, but it's just an idea to check.

Link to another question handling with font-awesome: Font Awesome icons are not working, I have included all required files

nitrolack
  • 1
  • 1