title: How to force Twitter Bootstrap .dl-horizontal DT content to wrap instead of truncate?
body: <p>Bootstrap has great horizontal definition list styling, but <strong>I want the DT content to wrap, not be truncated</strong>. </p>
  
  <p>I know on their <a href="http://twitter.github.com/bootstrap/base-css.html" rel="noreferrer">base.css page</a> they say: <em>"Heads up! Horizontal description lists will truncate terms that are too long to fit in the left column fix text-overflow."</em> </p>
  
  <p>Anyone know of a fix for this?</p>
  
  <p>Here's the off-the-shelf bootstrap CSS I've been wrenching on with no success:</p>
  
  <pre><code>.dl-horizontal {
    *zoom: 1;
  }
  .dl-horizontal:before,
  .dl-horizontal:after {
    display: table;
    content: "";
    line-height: 0;
  }
  .dl-horizontal:after {
    clear: both;
  }
  .dl-horizontal dt {
    float: left;
    width: 160px;
    clear: left;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  </code></pre>
  
  <p>My quesion here is similar to this question, if that helps:
  <a href="https://stackoverflow.com/questions/10566451/how-to-prevent-twitter-bootstrap-dds-from-going-up-if-empty">Prevent Twitter bootstrap empty &lt;dd&gt; filling with next &lt;dd&gt; value</a></p>
  
  <p>Thanks in advance!</p>