From 2ff6c5de1680f7c79d00f868d7f50c8d6b57764d Mon Sep 17 00:00:00 2001 From: igloosi Date: Tue, 10 Jul 2018 22:29:11 +0100 Subject: [PATCH 1/2] Remove checkbox and radio label bottom margin With the labels, legends and headings work margin-bottom: 5px was added to govuk-label. This was intended for labels above text inputs but has been applied to checkbox and radios too. So govuk-checkboxes__label and govuk-radios__label need to have margin-bottom: 0; applied to override this. --- src/components/checkboxes/_checkboxes.scss | 1 + src/components/radios/_radios.scss | 1 + 2 files changed, 2 insertions(+) diff --git a/src/components/checkboxes/_checkboxes.scss b/src/components/checkboxes/_checkboxes.scss index ea2168978f..aadd5d23d5 100644 --- a/src/components/checkboxes/_checkboxes.scss +++ b/src/components/checkboxes/_checkboxes.scss @@ -58,6 +58,7 @@ .govuk-checkboxes__label { display: inline-block; + margin-bottom: 0; padding: 8px $govuk-checkboxes-label-padding-left-right govuk-spacing(1); cursor: pointer; // remove 300ms pause on mobile diff --git a/src/components/radios/_radios.scss b/src/components/radios/_radios.scss index 2f9df8d8f5..dabac002b7 100644 --- a/src/components/radios/_radios.scss +++ b/src/components/radios/_radios.scss @@ -62,6 +62,7 @@ .govuk-radios__label { display: inline-block; + margin-bottom: 0; padding: 8px $govuk-radios-label-padding-left-right govuk-spacing(1); cursor: pointer; // remove 300ms pause on mobile From fb91063039dd0dce1ad52575ba21f995d966313f Mon Sep 17 00:00:00 2001 From: igloosi Date: Tue, 10 Jul 2018 22:34:11 +0100 Subject: [PATCH 2/2] Document in CHANGELOG --- CHANGELOG.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 82731256c7..f75c5d861d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -53,6 +53,10 @@ 🔧 Fixes: +- Remove mistakenly applied 5px bottom margin from radio and checkbox + labels. + ([PR #883](https://github.com/alphagov/govuk-frontend/pull/883)) + - Apply `display:block` to `.govuk-main-wrapper` In IE11 `main` element is set to `display:inline` so padding