Select2: Dropdown not Exact width of Select Container (Simple Solution)

[videsignz]

I noticed when using this that the dropdown width would always be about 1px off either wider or narrower than the select. Not really a big deal but when using 1px borders, it just looks "wrong".

This seems to happen when you have the select set to a percentage in a responsive layout.

The solution is easy. Since .outerWidth rounds the pixels, you can use a different means of getting the exact width.

On line 4249 I changed this...

  AttachBody.prototype._resizeDropdown = function () {
    var css = {
      width: this.$container.outerWidth(false) + 'px'
    };

To this....

  AttachBody.prototype._resizeDropdown = function () {
    var css = {
      width: this.$container.get(0).getBoundingClientRect().width + 'px'
    };

This is an easy fix for those interested :)

[Ra1ningSn0w]

Thanks for working that out! Looks now perfectly smooth!

[dariospadoni]

Any chance to have this fix also in the distributed source code?

[alexweissman]

This is a duplicate of #1692.