A Pen by Ashley Coleman.

index.html

<ol>
  <li>
    <span>A long sentence must be hidden</span>
    <span>that must be inline-block</span>
  </li>
  <li>
    <span>Cras dignissim cursus nibh. Curabitur.</span>
    <span>In hac habitasse platea dictumst.</span>
  </li>
</ol>

oGjib.markdown

oGjib

A Pen by Ashley Coleman on CodePen.

License.

style.less

ol {
width: 250px;
}

li {
  width: 100%;
  background-color:cyan;
  
  span {
    vertical-align:bottom;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 50%;
    background-color:yellow;
  }
  
  span:hover {
    display: inline-block;
    overflow: visible;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    background-color:salmon;
    position:absolute;
  }
}