文字が多いときに途中の文字を隠そう

こんにちは。ペーターパンです。

 

ニュースなどの文字量がバラバラなものをブロックで横にいくつか並べた時に、

高さが揃わなかったり、レイアウトが崩れたりすると思います。

 

そんな時は、強制的に文字の途中を「…」にして、高さを調整する事がcssで出来ます。

 

.text {
 width: 500px;
 overflow: hidden;
 white-space: nowrap;
 text-overflow: ellipsis;
}

長い文字でレイアウトに影響する場合は、上記を使用してバランスを取ることも出来ます。
jsではなく、cssだけで調整でき結構便利です。

以上、ペーターパンでした。

関連記事