Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

Commit

Permalink
fix(autocomplete): fixes the sizing math
Browse files Browse the repository at this point in the history 
closes #6212

  Closes #7015
  • Loading branch information
@ThomasBurleson
Robert Messerle authored and ThomasBurleson committed Feb 4, 2016
1 parent 437b767 commit 2390d88
Showing 1 changed file with 3 additions and 1 deletion.
4 changes: 3 additions & 1 deletion src/components/tabs/js/tabsController.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -545,7 +545,9 @@ function MdTabsController ($scope, $element, $window, $mdConstant, $mdTabInkRipp
function updatePagingWidth() {
var width = 1;
angular.forEach(getElements().dummies, function (element) {
width += Math.ceil(element.offsetWidth);
// uses `getBoundingClientRect().width` rather than `offsetWidth` to include decimal values
// when calculating the total width
width += Math.ceil(element.getBoundingClientRect().width);
});
angular.element(elements.paging).css('width', width + 'px');
}
Expand Down

2 comments on commit 2390d88

@jozsi
Copy link

@jozsi jozsi commented on 2390d88 Feb 5, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fixes #6495 as well.

@mathewblackberry
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't believe the width=1 is required any longer, this looks like a fix to get around an issue where a small number of tabs would have been causing the tab bar to overflow now that getBoundingClientRect().width is being used it will cater for any extra space that was being removed via rounding from element.offsetWidth.

Math.ceil on the final width rather than each tab heading will also mean there are not additional pixels allocated to the width of the tabbar which could be the case if there are enough tabs.

function updatePagingWidth() {
     var width = 0;
     angular.forEach(getElements().dummies, function (element) {
     // uses `getBoundingClientRect().width` rather than `offsetWidth` to include decimal values
     // when calculating the total width
     width +=element.getBoundingClientRect().width;
     });
     angular.element(elements.paging).css('width', Math.ceil(width) + 'px');
   }

Please sign in to comment.