Twenty Twenty: The Media & Text block paragraph text not align properly when change media size.

[viralsampat]

Hello Team,

I have reviewed the "Media & Text" block and found that when we change media with from block setting "MEDIA WIDTH" to full width, The block paragraph text not align properly on front-end.

I have checked this scenario in other themes and its looks good on it.

So, I think that it should be same on both(Back-end & Front-end) sides.

Here, I have provided issue video: ​https://www.awesomescreenshot.com/video/28611147?key=3f7fc3967a017dcdd4ddddd5ddd8fc57

Environment info:

---

• WordPress version: WordPress 6.5.4 running,
• Themes:
  • Twenty Twenty: Version: 2.6
• Browser: Google Chrome, Version 126.0.6478.56 (Official Build) (arm64)
• Device: MacBook Air M1
• OS: macOS 14.5 (23F79)
• Gutenberg plugin: Version Version 18.5.0

Thanks,

[karmatosed]

I am going to note we need some testing for this. It would also be great to not just have video but have some screenshots to increase understanding. Thanks for reporting.

[viralsampat]

Hello @karmatosed

Thank you so much for the update.

Here, I have attached screenshot before/after change for reference.

Thanks,

[viralsampat]

I have checked above mentioned issue and I have resolved it and added patch. Also, I have attached screenshot after resolved this issue.

[viralsampat]

Back-end

[viralsampat]

Front-end

[viralsampat]

After resolved issue Back-end:

[viralsampat]

After resolved issue front-end:

[poena]

On the front, the media & text block has different padding applied depending on the browser width

@media (min-width: 700px) {
    .wp-block-media-text .wp-block-media-text__content {
        padding: 4rem;
    }
}

.wp-block-media-text .wp-block-media-text__content {
    padding: 3rem 2rem;
}

While in the editor, only the block's default padding is applied:

    padding: 0 8%;