-
Notifications
You must be signed in to change notification settings - Fork 334
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix Sass rounding issues with width of grid columns #3199
Conversation
one-third = 330px (not 329.98px) two-thirds = 660px (not 659.98px)
8d3fdd6
to
1a1662c
Compare
@owenatgov Pushed up a CHANGELOG entry. Thanks (Also noticed a previous fix was missing a PR number, let me know if that change is unwelcome and I'll remove) |
- [#3150: Add missing `Event` polyfill to accordion component JavaScript](https://github.com/alphagov/govuk-frontend/pull/3150) | ||
- [Correcting incorrect closing double quotes in pagination Nunjucks](https://github.com/alphagov/govuk-frontend/pull/3156) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Whoops. Thanks for fixing that 😁
The Node.js v4 download for our LibSass v3.3.0 check is throwing an HTTP 500 😶 |
It's back up now, checks all passing |
This PR changes our grid column percentage sizes so they're rounded to the maximum precision available to Sass
By rounding ⅔ to
66.6666%
66.6667%
(note the 67 not 66) we see browsers render ourone-third
andtwo-thirds
grid column widths to whole pixels, which fixes #2361It appears that no change in
node-sass
decimal precision is necessary 🎉But we can go further by calculating
two-thirds: (200% / 3)
to add another decimal place:Before
After
Note: Unlike LibSass (and
node-sass
) Dart Sass will output66.6666666667%
with 10 decimal places of precision