HTML гиперссылки не работают - PullRequest
0 голосов
/ 01 мая 2018
     <div class="item slides">
      <div class="slide-12"></div>       
      <div class="hero3">  
          <h1>Reach out at</h1>      
          <a href="https://www.linkedin.com/in/sowmiya-nagarajan/" 
          class="fa fa-linkedin"></a>
          <a href="https://github.com/strangest-quark" class="fa fa-
          github"></a>
          <a href="https://www.snapchat.com/add/strangely-quark" 
          class="fa fa-snapchat-ghost"></a>
          <a href="https://www.facebook.com/nagarajan.sowmiya" 
          class="fa fa-facebook"></a>
          <a href="https://www.instagram.com/strange._.quark/" 
          class="fa fa-instagram"></a>
      </div>    
    </div>

Гиперссылки в приведенном выше фрагменте кода не активируются. Это может быть проблемой другого перекрывающегося div. Ссылки работают, когда я использую вкладку.

Я пробовал z-index в разных комбинациях, но ни одна из них, похоже, не работает!

Найдите полный html и css файл по следующим ссылкам:

  1. CSS
  2. HTML

Любая помощь приветствуется.

Ответы [ 2 ]

0 голосов
/ 01 мая 2018

В ссылках нет содержимого Что вы можете сделать, если вы хотите использовать ссылки только для значков, так это поместить классы fa-* в тег span или i внутри тега a следующим образом:

<a href="https://example.com" >
    <span class="fa fa-linkedin"></span>
</a>

Это приводит к тому, что тег a действительно имеет контент и становится кликабельным.

0 голосов
/ 01 мая 2018

Я добавил текст в теги привязки. Но, похоже, вам нужно показать их в виде значков Font Awesome. В этом случае достаточно одного пробела. Или хорошо &nbsp;

  <div class="hero3">  
      <h1>Reach out at</h1>      
      <a href="https://www.linkedin.com/in/sowmiya-nagarajan/" 
      class="fa fa-linkedin"> sowmiya-nagarajan</a>
      <a href="https://github.com/strangest-quark" class="fa fa-
      github"> strangest-quark</a>
      <a href="https://www.snapchat.com/add/strangely-quark" 
      class="fa fa-snapchat-ghost"> strangely-quark</a>
      <a href="https://www.facebook.com/nagarajan.sowmiya" 
      class="fa fa-facebook">&nbsp;</a>
      <a href="https://www.instagram.com/strange._.quark/" 
      class="fa fa-instagram"> </a>
  </div>    
...