title: Linking CSS to Taggle.js
body: <p>I am fairly new to CSS and javascript. I have been trying to implement the Tagging system as provided in Taggle.js (<a href="http://sean.is/poppin/tags" rel="nofollow noreferrer">http://sean.is/poppin/tags</a>). </p>
  
  <p>Using this script : </p>
  
  <pre><code>  &lt;html&gt;
    &lt;body&gt;
      Hello!! &lt;br&gt;
      &lt;form id="form1" action="http://127.0.0.1:5000/post"&gt;
        &lt;fieldset&gt;
          Tags:
          &lt;div id ="freeTags" &gt;&lt;/div&gt;
          &lt;p id='tag'&gt;&lt;/p&gt;&lt;br&gt;&lt;br&gt;
       &lt;/fieldset&gt;
      &lt;/form&gt;
  
      &lt;script src="./node_modules/taggle/assets/js/taggle.js"&gt;&lt;/script&gt;
      &lt;script&gt;
      var text = document.getElementById('tag');
      new Taggle('freeTags', {
        onTagAdd: function(event, tag) {
          text.innerHTML = "You just added " + tag;
        },
        onTagRemove: function(event, tag) {
          text.innerHTML = "You just removed "+ tag;
        },
        duplicateTagClass : "bounce"
  
      });
      &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I am unable to get the same effect as on the website (fancy text box) instead what I have been getting is this:</p>
  
  <p><img src="https://i.stack.imgur.com/vLAlf.png" alt="enter image description here"></p>
  
  <p>And it is also not implementing the 'bounce' function although I installed bounce.js using bower. </p>
  
  <p>I think it must be the issue of CSS linkage to HTML. Can any one help in untangling this issue?</p>