text-overflow
Esta propiedad te permite modificar el comportamiento que tiene por defecto el navegador cuando un texto no cabe y se desborda. Los valores que puede tener son: clip | ellipsis | texto, es decir, desbordar el contenedor (valor por defecto), muestra puntos suspensivos cuando el texto no cabe, o mostrar un texto cuando no cabe y no queremos que muestre los puntos suspensivos.
h1{
border: 2px solid black;
width: 200px;
white-space: nowrap;
overflow: hidden; /* IMPORTANTE */
text-overflow: ellipsis;
}