diff --git a/packages/block-library/src/columns/style.scss b/packages/block-library/src/columns/style.scss index 801af96e003370..385d5ad26282c1 100644 --- a/packages/block-library/src/columns/style.scss +++ b/packages/block-library/src/columns/style.scss @@ -47,11 +47,14 @@ // Between mobile and large viewports, allow 2 columns. @media (min-width: #{ ($break-small) }) and (max-width: #{ ($break-medium - 1) }) { - // As with mobile styles, this must be important since the Column - // assigns its own width as an inline style, which should take effect - // starting at `break-medium`. - flex-basis: calc(50% - 1em) !important; - flex-grow: 0; + // Only add two column styling if there are two or more columns + &:not(:only-child) { + // As with mobile styles, this must be important since the Column + // assigns its own width as an inline style, which should take effect + // starting at `break-medium`. + flex-basis: calc(50% - 1em) !important; + flex-grow: 0; + } // Add space between the multiple columns. Themes can customize this if they wish to work differently. // Only apply this beyond the mobile breakpoint, as there's only a single column on mobile.