Text-Overflow Utilities

.ellipsis { text-overflow: ellipsis }
.clip { text-overflow: clip }

@media screen and (min-width:  576px) {
  .sm:ellipsis { text-overflow: ellipsis }
  .sm:clip { text-overflow: clip }
}

@media screen and (min-width:  768px) {
  .md:ellipsis { text-overflow: ellipsis }
  .md:clip { text-overflow: clip }
}

@media screen and (min-width:  992px) {
  .lg:ellipsis { text-overflow: ellipsis }
  .lg:clip { text-overflow: clip }
}

@media screen and (min-width:  1200px) {
  .xl:ellipsis { text-overflow: ellipsis }
  .xl:clip { text-overflow: clip }
}