Skip to content
This repository was archived by the owner on Oct 2, 2019. It is now read-only.

Incorrect control width after window resize (bootstrap theme only) #1919

Open
Zaczero opened this issue Feb 21, 2017 · 2 comments
Open

Incorrect control width after window resize (bootstrap theme only) #1919

Zaczero opened this issue Feb 21, 2017 · 2 comments

Comments

@Zaczero
Copy link

Zaczero commented Feb 21, 2017

Bug description:

After resizing a browser's window, control's width become longer.
Sometimes it's just +20 px and sometimes it's +500px

Link to minimally-working plunker that reproduces the issue:

Simply https://angular-ui.github.io/ui-select/demo-bootstrap.html

Version of Angular, UI-Select, and Bootstrap/Select2/Selectize CSS

Your own demo. Tested on google chrome and firefox.

FIX?

  1. Find that code in select.js (lines: ~815-829)
    var input = ctrl.searchInput[0], container = ctrl.searchInput.parent().parent()[0], calculateContainerWidth = function() { // Return the container width only if the search input is visible return container.clientWidth * !!input.offsetParent; }, updateIfVisible = function(containerWidth) { if (containerWidth === 0) { return false; } var inputWidth = containerWidth - input.offsetLeft - 10; if (inputWidth < 50) inputWidth = containerWidth; ctrl.searchInput.css('width', inputWidth+'px'); return true; };

  2. Change
    ctrl.searchInput.css('width', inputWidth+'px');
    into
    ctrl.searchInput.css('width', '100%');

  3. Profit

@Jefiozie
Copy link
Contributor

Is this not the same problem as #1874

@jared-rufer
Copy link

Actually #1874 made the problem worse for bootstrap.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

3 participants