長すぎる文字を省略する方法
![](https://outsystems.ryoma-portfolio.com/wp-content/uploads/2020/05/741aec472f17c1db8407ec5f084c35dc.jpg)
OutSystemsでTableRecordsやExpressionなどで長い文字が入ることがあります。
TableRecordsでは、長すぎる文字が入力されると、改行されてしまい、レイアウトが崩れてしまいます。
そこで、改行を防ぎレイアウトが崩れないための方法を解説します。
CSSを設定する
![](https://outsystems.ryoma-portfolio.com/wp-content/uploads/2020/05/CSS.jpg)
長すぎる文字を省略するためのCSSを設定します
Web Screenの「Style Sheet」-「…」を押下します。
![](https://outsystems.ryoma-portfolio.com/wp-content/uploads/2020/05/Screen-Style-Sheet.jpg)
WebScreenに下記のcssを入力します。
.line_omitted
{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
CSSを反映する
![](https://outsystems.ryoma-portfolio.com/wp-content/uploads/2020/05/Expression-2.jpg)
文字の省略を反映したい、上の階層の「Container」や「Cell」などの「Style Classes」にCSSを反映します。
![](https://outsystems.ryoma-portfolio.com/wp-content/uploads/2020/05/741aec472f17c1db8407ec5f084c35dc-1.jpg)
以上、長い文字を省略する方法でした。
コメント