title: jQuery dotdotdot plugin not working
body: <p>I am trying to show list of comments in a panel using dotdotdot plugin but result is not cheering:</p>
  
  <p><img src="https://i.stack.imgur.com/2wWXy.png" alt="comments"></p>
  
  <p>From below xhtml code:</p>
  
  <pre><code>&lt;li&gt;
      &lt;h:link value="#{Comment.commentAuthorName}: " id="goToProfileWithAuthorName"
              outcome="/profile.xhtml" type="submit"
              style="text-decoration:none;font-weight:bold;font-size: 11px;color: rgb(120,120,159);"&gt;
          &lt;f:param name="userId" value="#{Comment.comauthorId}"/&gt;
      &lt;/h:link&gt;
  
      &lt;div id="wrapper"&gt;
          #{Comment.commentText}
      &lt;/div&gt;
      &lt;br&gt;&lt;/br&gt;
      &lt;abbr class="timeago" title="#{Comment.commentDate}"
            style="color: #778899;font-size: 10px;"&gt;
      &lt;/abbr&gt;
  
      &lt;br/&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>And below js code:</p>
  
  <pre><code>$(document).ready(function() {
      $("#wrapper").dotdotdot({
          //  configuration goes here
      });
  })
  </code></pre>
  
  <p>If I resolve the overflowing issue I could solve vertical size issue maybe but something is not correct about dotdotdot I guess. Let me show you one more weird thing:</p>
  
  <p><img src="https://i.stack.imgur.com/o3jP4.png" alt="dotdot2"></p>
  
  <p>As you can see, it seems div(wrapper) width value calculated correctly but text is keep overflowing. What can be the reason?</p>
  
  <p>Thanks for helping. </p>