Post Author Block with Gravatar image causes visual overlap with outline

[annezazu]

Description

When using the post author block, if there is a corresponding gravatar, the outline of the block overlaps with the gravatar image. This is being raised as part of the FSE outreach program call for testing.

Step-by-step reproduction instructions

Please list the steps needed to reproduce the bug. For example:

1. Use a block based theme and the latest version of Gutenberg to setup the FSE experience.
2. Go to "Site Editor (beta)"
3. Add the Post Author block to a post where the author has a gravatar
4. See block outline overlap.

Expected behaviour

I expected the block outline to properly correspond to the full content of the block including the gravatar image.

Actual behaviour

There is visual overlap with the gravatar image and the block outline.

Screenshots or screen recording (optional)

WordPress information

• WordPress version: 5.6.2
• Gutenberg version: 10.0.2
• Are all plugins except Gutenberg deactivated? Yes
• Are you using a default theme (e.g. Twenty Twenty-One)? TT1 blocks

[ntsekouras]

@Addison-Stavlo any hints why you had added this css: https://github.com/WordPress/gutenberg/pull/22877/files#diff-d1bd9a8cfdeac2927c7f0f6dbbf4e6f20378dcb2533194fe08bc32e2465a314cR23?

@jasmussen any quick css fix in mind if you find some time 😄 ?

[jasmussen]

It appears to be that negative margin, and the quick fix is to remove that. Happy to make a PR if you like? But if it can wait it might be good to get the context for why it was added:

[youknowriad]

I was not able to reproduce this issue. Although I'm not totally sure about my testing.

[youknowriad]

I'm not sure about my testing but I was not able to reproduce this one.