Fix CSS text wrapping for single selects
Select2 previously had an issue displaying the text of long values as it was not correctly wrapping the text. This was because the browser did not know that it couldn't wrap at whitespace, which has been fixed. Now Select2 should properly display an ellipsis for large text values instead of overflowing. This closes https://github.com/select2/select2/issues/2984.
This commit is contained in:
parent
0c0e2527fa
commit
473267404a
3 changed files with 7 additions and 4 deletions
5
dist/css/select2.css
vendored
5
dist/css/select2.css
vendored
|
@ -13,10 +13,11 @@
|
|||
-webkit-user-select: none; }
|
||||
.select2-container .select2-selection--single .select2-selection__rendered {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
padding-left: 8px;
|
||||
padding-right: 20px;
|
||||
text-overflow: ellipsis; }
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap; }
|
||||
.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
|
||||
padding-right: 8px;
|
||||
padding-left: 20px; }
|
||||
|
|
2
dist/css/select2.min.css
vendored
2
dist/css/select2.min.css
vendored
File diff suppressed because one or more lines are too long
|
@ -11,10 +11,12 @@
|
|||
|
||||
.select2-selection__rendered {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
padding-left: 8px;
|
||||
padding-right: 20px;
|
||||
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue