Links not working on Twitter Bootstrap Modal (2.3.2)

Question

This is a very puzzling issue, but all the links I have in the below modal do not work (clicking on the links, nothing happens). The code is below:

<section class="signupArtistModal">
<div id="myModal" class="modal-styling modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-toggle="modal" style="display:none">

  <div class="modal-header">
    <span class="top-cross">
    <a href="#" id="close-modal" data-dismiss="modal1" aria-hidden="true"><i class="fa fa-times fa-2x" style="float:right;"></i></a>
    </span>
    <br>
    <article class="modalTopPart welcome-modal-top">
    <p>Congratulations!</p>
    </article>
  </div>
  <div class="modal-body">
    <div class="center">
    <div class="share-first-text">Share with your friends and make this show happen.</div>

    <ul>
    <li style="display:inline; margin-right:10px;"><a href="https://twitter.com" target="_blank"><i class="fa fa-twitter fa-2x"></i></a></li>
    <li style="display:inline;"><a href="https://facebook.com" target="_blank"><i class="fa fa-facebook fa-2x"></i></a></li>
    </ul>

    </div>
  </div>

</div>
</section>

Any idea what may be going on?

Answer 1

The behavior is strange why it won't open the link, I can even right click and choose to open in a new tab. The solution I came up with is to use JavaScript inline to force the event. Here's the code for twitter you can apply the same to the Facebook tag: Here the twitter link works in this updated JS FIDDLE

<li style="display:inline; margin-right:10px;"><a href='http://twitter.com' 
 onclick='window.open("http://twitter.com");return false;'><i class="fa fa-twitter fa-2x">  
</i></a></li>