text-overflow: ellipsis をつかえばいい感じに省略してくれます。 p { width: 150px; /* 最大幅を設定する */ font-size: 22px; text-overflow: ellipsis; white-space: nowrap; /* これがないと最大幅を超えた部分が折り返される */ overflow: hidden; /* …