#50086 closed defect (bug) (invalid)
Twenty Fifteen: Correct extra border around the editor in Gutenberg 7.8.1 and above.
Reported by: | kjellr | Owned by: | |
---|---|---|---|
Milestone: | Priority: | normal | |
Severity: | normal | Version: | |
Component: | Bundled Theme | Keywords: | has-patch |
Focuses: | css | Cc: |
Description
If using the Gutenberg plugin, version 7.8.1 and above, some older themes will show a gray border around the editor. That border is the remnant of some legacy margin styles added by the theme, and intended originally for the TinyMCE editor. Previously, these margins were not visible, however recent versions of the editor have adopted a gray background behind the editor's wrapper in order to house responsive previews.
More details are available in this GitHub ticket:
https://github.com/WordPress/gutenberg/issues/21535
This is especially problematic on smaller screens:
The easiest way to fix this per theme is to increase specificity of those margin rules so that they only appear when using TinyMCE. The patch attached here is a first pass at that for Twenty Fifteen. If we're okay with this approach (and are not going to be fixing this within Gutenberg itself), I can start doing this for other default themes that are effected by this issue.
With the attached patch applied, the classic editor view should appear the same, while the editor view will appear with no additional margins:
Alternate Solution:
Rather than wrap the margin in its own tag, we could also just remove the margin entirely, as seen in 5086-alternate.diff . This is cleaner and seems relatively harmless too:
Before:
After: