3点リーダを打ち消して改行させるCSS
Reactのコンポーネントにデフォルトで設定されているoverflow時の3点リーダを打ち消して改行させる。
Material-UIのTableRowColumn
http://www.material-ui.com/#/components/table
Material-UIのTable(TableRowColumn)には下記のようなスタイルがデフォルトであたっている。
text-overflow: ellipsis;
これは、内容のテキストがテーブルセルの幅よりも大きくなったときに三点リーダを表示する。
長い文字列を改行して全て表示させる
<TableRowColumn
key={index}
style={{
paddingLeft: 5,
paddingRight: 5,
whiteSpace: 'normal',
wordWrap: 'break-word'}}>
長い文字列長い文字列長い文字列長い文字列長い文字列長い文字列長い文字列長い文字列長い文字列
</TableRowColumn>
whiteSpace: 'nomal',
wordWrap: 'break-word'
を指定すれば改行されるようになる。
Author And Source
この問題について(3点リーダを打ち消して改行させるCSS), 我々は、より多くの情報をここで見つけました https://qiita.com/gyarasu/items/35ba7e72156a56a44162著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .