Skip to content
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 container not being centered in IE8 #1147

Merged
merged 2 commits into from
Jan 17, 2019
Merged

Conversation

NickColley
Copy link
Contributor

@NickColley NickColley commented Jan 17, 2019

This allows browsers that do not support media queries to be centered without a separate stylesheet.

Since the header and the footer component use this container it also fixes centering for these components.

Fixes #1145


Screenshots

Before

before

After

after

@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1147 January 17, 2019 11:24 Inactive
@NickColley NickColley force-pushed the fix-centering-container-ie8 branch from e5788c6 to 101903a Compare January 17, 2019 11:31
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1147 January 17, 2019 11:31 Inactive
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1147 January 17, 2019 11:35 Inactive
@NickColley NickColley requested a review from dashouse January 17, 2019 11:35
@NickColley NickColley force-pushed the fix-centering-container-ie8 branch from 722c9d4 to 9754239 Compare January 17, 2019 12:10
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1147 January 17, 2019 12:10 Inactive
@NickColley NickColley force-pushed the fix-centering-container-ie8 branch from 9754239 to 869ded1 Compare January 17, 2019 12:11
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1147 January 17, 2019 12:11 Inactive
@NickColley NickColley changed the title Reorder container to be desktop first Fix container not being centered in IE8 Jan 17, 2019
@NickColley NickColley removed the request for review from dashouse January 17, 2019 12:19
@NickColley NickColley force-pushed the fix-centering-container-ie8 branch from 869ded1 to 33691f0 Compare January 17, 2019 12:20
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1147 January 17, 2019 12:20 Inactive
@NickColley
Copy link
Contributor Author

NickColley commented Jan 17, 2019

I tried to reorder the CSS desktop first but SassMQ smushes 'desktop' media queries into the output CSS which stops that from working...

In the future if we decide to drop IE8 we might consider changing this to be desktop first and avoid that behaviour in sass mq

@NickColley NickColley force-pushed the fix-centering-container-ie8 branch from 33691f0 to 9172433 Compare January 17, 2019 12:23
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1147 January 17, 2019 12:23 Inactive
@NickColley NickColley self-assigned this Jan 17, 2019
Copy link
Contributor

@36degrees 36degrees left a comment

Choose a reason for hiding this comment

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

👍

// On mobile, add half width gutters
margin: 0 $govuk-gutter-half;

Copy link
Contributor

Choose a reason for hiding this comment

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

unintentional whitespace changes?

@NickColley NickColley force-pushed the fix-centering-container-ie8 branch from 9172433 to acec7fc Compare January 17, 2019 16:49
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1147 January 17, 2019 16:49 Inactive
Since the header and the footer component use this container it also fixes centering for these components.
@NickColley NickColley force-pushed the fix-centering-container-ie8 branch from acec7fc to 52f3ac5 Compare January 17, 2019 16:52
@NickColley NickColley merged commit 0730e73 into master Jan 17, 2019
@NickColley NickColley deleted the fix-centering-container-ie8 branch January 17, 2019 16:56
@NickColley NickColley added this to the [NEXT] milestone Jan 21, 2019
This was referenced Jan 31, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Development

Successfully merging this pull request may close these issues.

Header is misaligned in Internet Explorer 8
3 participants