1行に留まるためにテキストを小さくするにはどうすればよいですか？

私は<td>を持っています。ユーザーがフィールドを塗りつぶしたときにテキストに入力されます。ユーザーが入力したテキストの幅が200pxより大きい場合は、それが折り返してデザインを駄目にします。ラップするのではなく、1行に収まるようにテキストを小さくする方法はありますか？1行に留まるためにテキストを小さくするにはどうすればよいですか？

出典

2011-12-18 oobie11

Javascriptを使用しないでください（簡単にはできません）。あなたは 'オーバーフローすることができます：私は思いますが、それは要素よりも長いものを隠すだけです。 –

実際、 'overflow：hidden 'を' td'することはできません。あなたは 'p'タグをつけることができます：http://jsfiddle.net/aB9BX/ –

それはやるのが難しいだけでなく、おそらくユーザーには本当に迷惑になるでしょう。（短くなるテキストはすぐに全部読めなくなります）通常のサイズのテキストを折り返すように設計することをお勧めします（垂直にスクロールできる 'textarea'を使用するなど） –

文字列の最大長を設定したほうがよい場合は、文字数を超えて「... 」というテキストを追加してください。タグ内にタイトルを置くので、マウスオーバーすると完全に読むことができます。

例：あなたは省略記号を使用することができますblabla BLA BLAのBLA ...

視覚的なテキストでわずか、タイトル

出典

2011-12-18 08:21:05 Develious

を使用し、これは、more info about this

td p { 
    white-space: nowrap; 
    width: 100%; 
    overflow: hidden; 
    text-overflow: ellipsis; 
}

CSS3プロパティです

出典

2011-12-18 08:47:56

@ oobie11申し訳ありませんが、プロジェクトでCSS3を使用しようとしないとします。 –

w3schoolsへのリンクは、一般的にはSOの上で眉をひそめます。参照：http://w3fools.com –

1行に留まるためにテキストを小さくするにはどうすればよいですか？

答えて

関連する問題