You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Describe the bug
Several Blocks have alignment controls which afford wide and full widths (eg: section, cover...etc). These Blocks display correctly in the Editor as a wide or full width as required.
When creating a Reusable Block however, a core/block Block <div> is created to contain the Blocks within the Reusable Block.
By default this core/block behaves like other Block wrapper <div> and is the standard width as defined by the following CSS rule which applies to all Blocks:
.wp-block {
max-width:610px;
}
This causes the Blocks within the Reusable Block to be constrained to the standard width even if they themselves are set to wide or full:
Expected behavior
The resuable Block should not constrain the width of the Blocks within it. This can be achieved by removing the max-width, horiztonal padding and margins. The result is then as expected (ie: the Blocks within are as wide as they need to be based on their align settings).
Note the Reusable Block shown in the above screenshot contains a section Block with a blue background which is set to full align setting. See how it occupies the full width of the editor (almost! - a few tweaks still needed).
To Reproduce
Steps to reproduce the behavior:
Add a few Blocks which support wide and full align settings (eg: cover, section)
Set the Blocks to be full alignment - notice the width fills the editor canvas.
Create a Reusable Block from the Blocks created above
See how the Blocks are now constrained in width.
Screenshots
See above
Desktop (please complete the following information):
All
Smartphone (please complete the following information):
All
The text was updated successfully, but these errors were encountered:
Describe the bug
Several Blocks have alignment controls which afford
wide
andfull
widths (eg:section
,cover
...etc). These Blocks display correctly in the Editor as a wide or full width as required.When creating a Reusable Block however, a
core/block
Block<div>
is created to contain the Blocks within the Reusable Block.By default this
core/block
behaves like other Block wrapper<div>
and is the standard width as defined by the following CSS rule which applies to all Blocks:This causes the Blocks within the Reusable Block to be constrained to the standard width even if they themselves are set to
wide
orfull
:Expected behavior
The resuable Block should not constrain the width of the Blocks within it. This can be achieved by removing the
max-width
, horiztonalpadding
andmargin
s. The result is then as expected (ie: the Blocks within are as wide as they need to be based on their align settings).Note the Reusable Block shown in the above screenshot contains a
section
Block with a blue background which is set tofull
align setting. See how it occupies the full width of the editor (almost! - a few tweaks still needed).To Reproduce
Steps to reproduce the behavior:
wide
andfull
align settings (eg:cover
,section
)full
alignment - notice the width fills the editor canvas.Screenshots
See above
Desktop (please complete the following information):
All
Smartphone (please complete the following information):
All
The text was updated successfully, but these errors were encountered: