css text cut

by simati

HTML

<p class="one-long-line">
When text must stay on one line, but there is not enough room for it all, this article provides a solution.
</p>

CSS

.one-long-line {
   max-width: 80px;
   white-space:nowrap; 
   overflow:hidden;
   text-overflow:ellipsis;
   }
.one-long-line:hover {
   overflow:visible;
   }