Skip to content

Conversation

@spinnercat
Copy link
Contributor

Browsers affected: Firefox v51 for Windows

This is actually a firefox bug but I think ui-grid should support it. When a div has maxWidth and minWidth that are floats, sometimes the computed width of the div (for reasons I don't yet understand) gets rounded. Most notably, sometimes the width gets rounded up by up to 0.01 pixels so that the computed width is greater than the maxWidth. In a ui-grid, this can cause the divs to sum to larger than the parent row width which causes the last cell to spill to the next row (blurred for confidentiality):
image

This Firefox bug is evident in the following plunker which was created based on the HTML/CSS output of our ui-grid: https://plnkr.co/edit/d85iZpOtJNmBl1YmRPCp - works fine on Chome and Firefox on Mac, but the computed div widths are slightly greater than maxWidth on Firefox running on Windows. This causes the last cell to spill to the next line. I think the best workaround is to have all pixel values by integers.

@dlgski dlgski merged commit 35c961e into angular-ui:master Mar 3, 2017
@RobPierce
Copy link
Contributor

This has an unintended consequence of leaving space to the right hand side of the columns if all columns are set to percentage widths as the rounding down of the column width leaves some remaining space that isn't then used if there are no asterisk column sizes. I'm just looking to a fix to ensure that any remaining space is allocated - question is how best to do that as just adding it onto the end column would be simplest but doesn't seem the cleanest solution.

@RobPierce
Copy link
Contributor

Just seen the logic to allocate remaining space - does this for asterisk but not percentage column widths as a fallback so will create a PR to fallback to allocating over percentage column widths if there are no asterisk column widths.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

4 participants