diff --git a/packages/styles/scss/components/masthead/_masthead-megamenu.scss b/packages/styles/scss/components/masthead/_masthead-megamenu.scss index c99378f1183..c11bb56bf63 100644 --- a/packages/styles/scss/components/masthead/_masthead-megamenu.scss +++ b/packages/styles/scss/components/masthead/_masthead-megamenu.scss @@ -125,10 +125,10 @@ --#{$c4d-prefix}-masthead-max-height: calc( 100vh - var(--cds-spacing-09, 3rem) - var(--cds-layout-05, 4rem) ); - --#{$c4d-prefix}-masthead-overflow: overlay; + --#{$c4d-prefix}-masthead-overflow: auto; display: block; - overflow: hidden overlay; + overflow: hidden auto; background-color: $background; &:focus { @@ -421,6 +421,16 @@ display: block; &.only-child { + /** + * Necessary to accommodate Safari issue with columns. + * + * Container height is calculated before breaking into specified number + * of columns, which causes extra blank whitespace beneath column content. + */ + .#{$prefix}--masthead__megamenu__category-group-content-wrapper { + display: inline; + } + .#{$prefix}--masthead__megamenu__category-group-heading { @include make-col(1, 2);