Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Aligned cover block: In the editor, the block width changes depending on the content. #21855

Closed
carolinan opened this issue Apr 24, 2020 · 2 comments
Labels
[Block] Cover Affects the Cover Block - used to display content laid over a background image [Type] Enhancement A suggestion for improvement.

Comments

@carolinan
Copy link
Contributor

Describe the bug

If I align a cover block to the left or right, and start typing the first paragraph, the width of the block is reduced.
When I stop typing and save my post or page, the width of the block stays at that same width in the editor.
It shows at the expected width on the front.

Now If I add a second block inside the cover block, below the first paragraph, but deselect the block without adding content, the cover block is returned to it's expected width.

Now if I remove the inserter/block placeholder, the block is again reduced in width.

To reproduce
Steps to reproduce the behavior:

  1. Install and activate for example Twenty Nineteen. I choose this example because the issue is very obvious in this theme.
  2. In the editor, add a cover block. Align it to left or right.
  3. Start typing in the first paragraph block that becomes available.
  4. See how the block width changes. In Twenty Nineteen, each letter in the paragraph block are showing on their own line, in a one character column, which is not awesome.
  5. Press enter in the block so that a new paragraph placeholder shows.
  6. See that the width of the cover block is returned to the original, expected width.

Expected behavior
I expect the cover block to stay the same width while typing.
I expect the cover block to stay the same width no matter if a block placeholder is present inside of it.
I expect the width of the cover block to be the same in the editor and in the front.

Themes handle the alignments differently, but I don't think it is a theme issue because I could not find a theme where the width stayed the same, as I expected it to.

Screenshots
Editor
2019-right-align-cover-editor

Editor with placeholder present:
2019-right-align-cover-editor-placeholder-showing

Front:
2019-right-align-cover-front

Editor version (please complete the following information):

  • WordPress version: Version 5.4
  • Does the website has Gutenberg plugin installed, or is it using the block editor that comes by default?
    Tested both with and without Gutenberg with the same result.
  • If the Gutenberg plugin is installed, which version is it? Version 7.9.1

Desktop (please complete the following information):

  • OS: Win10
  • Browser: Chrome Version 81.0.4044.122
@annezazu
Copy link
Contributor

Thanks so much for this thorough report! I just wanted to note that this is similar to this open issue: #21836

@annezazu annezazu added [Block] Cover Affects the Cover Block - used to display content laid over a background image [Type] Enhancement A suggestion for improvement. labels Apr 28, 2020
@paaljoachim
Copy link
Contributor

Hi

I am testing with Twenty Nineteen. Gutenberg plugin 9.8. WordPress 5.6.
Added a Cover block. Aligned it right. Began typing.

This is what I see:
Screen Shot 2021-01-22 at 13 59 39

It looks the same with another paragraph below it as well as on the frontend.

I will close this issue. If I am mistaken then please reopen.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Cover Affects the Cover Block - used to display content laid over a background image [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

No branches or pull requests

3 participants