CSS文本超出希望右对齐

html-css024

CSS文本超出希望右对齐,第1张

在做form表单校验时,经常会出现但是校验失败的提示文本超出校验项宽度的现象:

当超出校验项宽度时,文本换行展示了,希望不换行展示,可以使用

不换行后发现文本直接向右溢出展示,但是因为校验项已经距离右边界很近了,超出右侧直接隐藏了,所以我们需要文本从右向左展示:

用DIV+CSS中设置代码:

.text-overflow{ 

display:block/*内联对象需加*/

width:31em

word-break:keep-all/* 不换行 */

white-space:nowrap/* 不换行 */

overflow:hidden/* 内容超出宽度时隐藏超出部分的内容 */

text-overflow:ellipsis/* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden一起使用。*/

}