CSS Ellipses Long Title

by Christian Juth

HTML

<span class='product-name'>Short title</span>
<span class='product-name'>Really really really really really really really lonnnnnnnnnnng title that just goes on and on and on and on and onnnnnnnn</span>

CSS

.product-name{
  width: 100%;
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis; 
  white-space: nowrap;
}