1div {
2 white-space: nowrap;
3 overflow: hidden;
4 text-overflow: ellipsis;
5}
1.overflow-information{
2 overflow: hidden;
3 display: inline-block;
4 text-overflow: ellipsis;
5 white-space: nowrap;
6 width:150px; //change based on when you want the dots to appear
7}
1/* Text is directly within flex child,
2 so doing the wrapping here */
3.flex-child {
4 white-space: nowrap;
5 overflow: hidden;
6 text-overflow: ellipsis;
7}