Grid block background causes inconsistent padding on frontend

[viralsampat]

Hello,

I have reviewed the Grid block and noticed a padding issue when a background is applied. On the admin/editor side, it looks correct, but on the front end, the layout appears messy due to inconsistent padding.

I think that it should be correct on both editor & front end.

For better understanding, I have attached its vide.

Thanks,

[viralsampat]

Issue video:

[doreen233]

Reproduction Report

Description

Attempted to reproduce issue #63935

Environment

• WordPress: 6.9-alpha-60093-src
• PHP: 8.2.29
• Server: PHP built-in development server (via Docker)
• Database: MySQL 8.4.6 (Community Server - GPL)
• Browser: Version 139.0.7258.155 (Official Build) (arm64)
• Theme: Twenty Twenty-Five 1.3
• Plugins: none activated

Steps to Reproduce

1. Create a new page
2. Insert a Grid block
3. Add a background color
4. View the block in both the block editor and on the frontend

Expected Results

Padding should appear inconsistent between the editor and frontend (as reported)

Actual Results

Padding was consistent in both editor and frontend. Issue could not be reproduced

Supplemental Artifacts

Add as Attachment

[doreen233]

Screenshot showing grid block padding rendering consistently in both editor and frontend

[noruzzaman]

Reproduction Report

Description

This report validates whether the issue can be reproduced.

Environment

• WordPress: 6.8.3
• PHP: 8.2.27
• Server: nginx/1.26.1
• Database: mysqli (Server: 8.0.35 / Client: mysqlnd 8.2.27)
• Browser: Chrome 141.0.0.0
• OS: macOS
• Theme: Twenty Fifteen 4.0
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.0

Actual Results

1. I was able to reproduce the issue.

Additional Notes

• The issue occurs in the Twenty Fifteen theme.

Screenshots

Editor	frontend

[rezwanshiblu1952]

Reproduction Report:

---

Description:
I found different results in the local and live server environments.

---

Replication Steps:

1.Create a new page
2.Add a Grid block
3.Set a background color like black and text color white
4.Now check the padding issue from the block editor backend to the frontend

---

Replication video:

1.Not replicated in the local environment, and here is the screen recording with voice - ​https://www.loom.com/share/f56b1edf48034096a17ea61238dd61f5

2.But Replicated in the live environment server, and here is the screen recording with voice - ​https://www.loom.com/share/ae1370e4f1cf497384d9d212d295f060

---

Note:

Finally, I rechecked this issue on the other 3 live sites and replicated it as a bug.

---

Environment:

1.WordPress: 6.8.3
2.PHP: 8.2.27
3.Server: nginx/apache
4.Database: mysqli 8.0.35
5.Browser: Chrome/Firefox
6.OS: Windows
7.Theme: Twenty Twenty-Five/Twenty Fifteen
8.Plugins: Not activated

---

Screenshots:

Backend: ​https://prnt.sc/bFsLgBSi0VNK
Frontend: ​https://prnt.sc/bzf_HEIQlJcf

---

Final Results:

I was able to replicate the issue. Padding should be the same from backend to frontend.

[huzaifaalmesbah]

@viralsampat Thanks for taking the time to report this issue!

I see you’ve mentioned Component Bundled Theme, but haven’t specified which bundled theme you’re referring to. Could you please clarify which theme you’re seeing this issue with?

This will help others reproduce and investigate the problem more effectively. Some contributors have already tested with themes like Twenty Twenty-Five and Twenty Fifteen, so confirming the exact theme will be very helpful.

Thanks again!