title: HTML to automatically hide text depending on scrolled size (like in Gmail)?
body: <p>Look at your Gmail inbox. You have 3 main columns</p>
  
  <ol>
  <li>contains the Sender</li>
  <li>contains "THE_EMAIL_SUBJECT - THE_EMAIL_BODY"</li>
  <li>the date the email was sent on</li>
  </ol>
  
  <p>I note that when you resize the window, the Gmail web client automatically resizes the displayed text in the second column. It basically just truncates the text so that it always can display the sent on date to the right, and the sender to the left. It is a pretty neat effect, and I would like to have that effect for myself. Does anyone know how to do this in HTML/CSS/JS?</p>