Related posts block - updated margin to make full-width

[MichaelArestad]

I noticed that the Related Posts block is indented 10px on the left and right side of whatever column it resides in. I added some negative margins as a quick hack to resolve this. In theory, now the column will line up.

Changes proposed in this Pull Request:

• Added some egative margin to account for list spacing of the grid view of the Related posts.

Is this a new feature or does it add/remove features to an existing part of Jetpack?

• Enhancement to existing feature

Before

After

Testing instructions:

Note: There is some additional margin added by the theme. This is taken care of in #13516

• Go to post-new.php
• Add the Related Posts block into your post content
• Make sure it aligns with the width of the block (it looks like due to the width calculations only going to 99% in the original, it will be a couple pixels shy of full width, but that's okay.

Proposed changelog entry for your changes:

• No changelog needed

[matticbot]

Caution: This PR has changes that must be merged to WordPress.com
Hello MichaelArestad! These changes need to be synced to WordPress.com - If you 're an a11n, please commandeer, review, and approve D34553-code before merging this PR. Thank you!

[jetpackbot]

Thank you for the great PR description!

When this PR is ready for review, please apply the [Status] Needs Review label. If you are an a11n, please have someone from your team review the code if possible. The Jetpack team will also review this PR and merge it to be included in the next Jetpack release.

Scheduled Jetpack release: November 5, 2019.
Scheduled code freeze: October 29, 2019

Generated by 🚫 dangerJS against dc231ae

[jeherve]

Is this needed for every theme out there? If so, where are the 10px added in the first place? Is that some CSS we could remove in Jetpack?

[MichaelArestad]

@jeherve It is needed for every theme. The 10px margin is on each Related Post Item applied to both left and right sides which puts some needed space between them. This simple aligns the outer edges correctly no matter the number of items in the grid.